,可以通过以下几种方式实现:
- 使用externals配置:在webpack的配置文件中,通过externals配置可以将全局变量作为外部依赖引入,而不打包进最终的构建文件。具体配置如下:module.exports = {
// ...
externals: {
// 将全局变量jQuery作为外部依赖引入
jquery: 'jQuery'
}
};这样,在项目中使用全局变量jQuery时,webpack会自动从外部引入,而不会将其打包进构建文件。
- 使用ProvidePlugin插件:在webpack的配置文件中,通过ProvidePlugin插件可以自动加载全局变量,使其在每个模块中都可直接访问。具体配置如下:const webpack = require('webpack');
module.exports = {
// ...
plugins: [
// 自动加载全局变量$
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery'
})
]
};这样,在项目中的任何模块中,都可以直接使用全局变量$和jQuery。
- 使用window对象访问全局变量:在webpack构建之后,全局变量会被挂载到window对象上,可以通过window对象直接访问。例如,全局变量$可以通过window.$或window.jQuery访问。
总结起来,以上是在webpack构建之后访问全局变量的几种常用方式。具体使用哪种方式取决于项目的需求和全局变量的具体情况。