KBar doesn't work in final build about kbar HOT 11 CLOSED

Will be reworking the imports in an upcoming PR which might fix this, or help us narrow down the issue.

from kbar.

Hey @WhoAdarshPandya, apologies for the late response! Can you try the latest release and let me know what you see there?

from kbar.

im seeing this error too with a vite build ...looks like the trace is pointing to:

var _c = (0, useKBar_1.default)(function (state) { return ({
        visualState: state.visualState,
        showing: state.visualState !== types_1.VisualState.hidden,
    }); }), query = _c.query, options = _c.options, visualState = _c.visualState, showing = _c.showing;

useToggleHandler in InternalEvents.js; am getting useKBar_1.default is not a function. unsure why though

from kbar.

This should be resolved in the latest release – thank you @kevinhu!

from kbar.

hey tim! Awsome work with the Kbar, i've been using it in my preact app - in dev mode it works fine but after production build it doesn't work. consider me a noob trying to solve things.

it shows something like this in console

vendor.822cbe4a.js:29 Uncaught TypeError: (0 , Zt.default) is not a function
    at Gf (vendor.822cbe4a.js:29)
    at Y.qf [as constructor] (vendor.822cbe4a.js:29)
    at Y.Ho [as render] (vendor.822cbe4a.js:1)
    at dr (vendor.822cbe4a.js:1)
    at ti (vendor.822cbe4a.js:1)
    at dr (vendor.822cbe4a.js:1)
    at ti (vendor.822cbe4a.js:1)
    at dr (vendor.822cbe4a.js:1)
    at ti (vendor.822cbe4a.js:1)
    at dr (vendor.822cbe4a.js:1)
Gf @ vendor.822cbe4a.js:29
qf @ vendor.822cbe4a.js:29
Ho @ vendor.822cbe4a.js:1
dr @ vendor.822cbe4a.js:1
ti @ vendor.822cbe4a.js:1
dr @ vendor.822cbe4a.js:1
ti @ vendor.822cbe4a.js:1
dr @ vendor.822cbe4a.js:1
ti @ vendor.822cbe4a.js:1
dr @ vendor.822cbe4a.js:1
Ie @ vendor.822cbe4a.js:1
(anonymous) @ index.dc5496f6.js:formatted:113

in index.js (pretty-printed) it highlights this portion

y(i(r.KBarProvider, {
    actions: S,
    children: [o(r.KBarPortal, {
        children: o(r.KBarPositioner, {
            children: i(r.KBarAnimator, {
                style: B,
                children: [o(r.KBarSearch, {
                    style: k,
                    placeholder: "Type a command or search\u2026"
                }), o(r.KBarResults, {})]
            })
        })
    }), o(g, {
        children: o(v, {})
    })]
}), document.getElementById("app"));

it'd be really great if you can help me with this. thanks in advance

update: it does work with webpack config, I think the problem is with usage of vite, can you please suggest something?

from kbar.

hey @timc1 , Thanks for reply, i guess problem comes when we try to bundle it with vite! webpack works fine with Kbar

from kbar.

hey @timc1 , Thanks for reply, i guess problem comes when we try to bundle it with vite! webpack works fine with Kbar

@WhoAdarshPandya How you fixed this issue finally? Replacing vite with webpack?

from kbar.

hey @timc1 , Thanks for reply, i guess problem comes when we try to bundle it with vite! webpack works fine with Kbar

@WhoAdarshPandya How you fixed this issue finally? Replacing vite with webpack?

not yet fixed, even I can't find what causes error because it works perfect in dev mode. can't replace vite for webpack which is laggy and slow compared to vite

from kbar.

thanks — I can test the branch on my build when it’s posted!

from kbar.

I had this issue as well, and it seems that Vite is unhappy about the default export syntax applied to a function. If you switch it to a named export, the build error goes away: #131

from kbar.

thanks @kevinhu and @timc1 💯

from kbar.