TypeError: $(...).tooltip is not a function with webpack

Question

I'm trying to migrate my application from requirejs to webpack 2 but i'm having trouble.

My webpack config :

 rules: [
            // rules for modules (configure loaders, parser options, etc.)

            {
                test: /\.jsx?$/,
                include: [
                    path.resolve(__dirname, "src")
                ],
                exclude: [
                    path.resolve(__dirname, "app/demo-files")
                ],

                enforce: "pre",
                enforce: "post",

            },

            {
                test: /underscore/,
                loader: 'expose-loader?_'
            },
            {
                test: /howler/,
                loader: 'expose-loader?Howl'
            },
            {
                test: /pathfinding/,
                loader: 'expose-loader?PF'
            },
            {
                test: /stats/,
                loader: 'expose-loader?Stats'
            },
            {
                test: /datgui/,
                loader: 'expose-loader?dat.gui'
            },
            { test: /jquery/,
                loader: 'imports?jQuery=jquery,$=jquery,this=>window'
            },
            {
                test: /jquery-ui/,
                use: [
                    'expose-loader?$',
                    'imports-loader?this=>window,jquery'
                ]
            }

And in plugin section :

plugins: [
            new webpack.ProvidePlugin({
                "$":"libs/jquery/jquery.min",
                "jQuery":"libs/jquery/jquery.min",
                "window.jQuery":"libs/jquery/jquery.min"
            }),
        ]

But when i do this i have the following error :

Game.js:48 Uncaught TypeError: $(...).tooltip is not a function
    at Game.init (Game.js:48)
    at Object.<anonymous> (init.js:6)
    at Object.<anonymous> (init.js:7)
    at __webpack_require__ (bootstrap aa1ecbe…:678)

Can you help me with this trouble ? I think the problem is with the import of jquery but i don't know how to resolve the issue...

Thanks

i didnt see the configuration of webpack for tooltip, you'll need to add jquery.tooltip? — Álvaro Touzón, Oct 16 '17 at 13:01
Did you follow all of the instructions here? https://stackoverflow.com/questions/33998262/jquery-ui-and-webpack-how-to-manage-it-into-module — Derek Brown, Oct 16 '17 at 13:03
by adding this to my alias : "jquery-ui": "libs/jquery-ui/jquery-ui.min.js", // bind to modules; modules: path.join(__dirname, "node_modules") i have another error : Uncaught TypeError: Cannot set property 'fontSpy' of undefined — nico, Oct 16 '17 at 13:12
Possible duplicate of [Uncaught ReferenceError: $ is not defined?](https://stackoverflow.com/questions/2075337/uncaught-referenceerror-is-not-defined) — jordiburgos, Oct 18 '17 at 13:50
@nico these errors arise when libraries do not load properly. `Cannot set property 'fontSpy' of undefined` will mean that an object or variable is `null` and you're trying to set a property of it. You will want to review your code for typos or other errors. You may want to use tools like jshint. — Twisty, Oct 19 '17 at 17:16
Hi, did you resolve this? I'm stuck with the exact same problem — Imnotapotato, Oct 04 '18 at 12:21

score -1 · Answer 1 · answered Feb 17 '20 at 20:46

-1

Try adding

Popper: ['popper.js', 'default']

To your plugins

answered Feb 17 '20 at 20:46

Pedro

1,352
2
10
22

TypeError: $(...).tooltip is not a function with webpack

1 Answers1