使用Webpack将jQuery公开到真实的Window对象

JavaScript Webpack

L十三

2020-03-23

我不会将jQuery对象公开给浏览器中开发人员控制台内部可访问的全局窗口对象。现在在我的webpack配置中，有以下几行：

plugins: [
                new webpack.ProvidePlugin({
                    $: 'jquery',
                    jQuery: 'jquery'
                })
            ]

这些行将jQuery定义添加到我的webpack模块中的每个文件中。但是，当我构建项目并尝试在开发者控制台中访问jQuery时，如下所示：

window.$;
window.jQuery;

它说这些属性是不确定的...

有没有办法来解决这个问题？

第2677篇《使用Webpack将jQuery公开到真实的Window对象》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共4个回答
米亚理查德 2020.03.23

Webpack v2的更新

按照Matt Derrick的说明安装暴露加载程序：

npm install expose-loader --save-dev

然后在您的中插入以下代码段webpack.config.js：

module.exports = {
    entry: {
        // ...
    },
    output: {
        // ...
    },
    module: {
        loaders: [
                { test: require.resolve("jquery"), loader: "expose-loader?$!expose-loader?jQuery" }
        ]
    }
};

（来自暴露加载程序文档）

小宇宙 2020.03.23

这一直对我有用。包括用于webpack 3 window.$ = window.jQuery = require("jquery");

逆天蛋蛋 2020.03.23

看起来该window对象已在所有模块中公开。

为什么不只是导入/要求JQuery并放入：

window.$ = window.JQuery = JQuery;

您需要确保在要求/导入需求window.JQuery模块中或正在使用该模块的任何模块之前/发生这种情况。

飞云Pro 2020.03.23

就我而言 

{ test: require.resolve("jquery"), loader: "expose?$!expose?jQuery" }

相似问题

0 回答

0 回答

5 回答

25 回答

0 回答

0 回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android