npm | 安装 jquery

使用 npm 安装，并使用 webpack 打包。

参考资料

• webpack引入jquery的方法

安装

npm i jquery

webpack.config.js

使用 ProvidePlugin。

ProvidePlugin 是一个 webpack 插件，用于自动加载某一模块，当一个项目很多地方都使用同一模块时，这个插件可以省去多个地方写import/require。不过，他在引入第三方库时也非常有用。

在webpack.config.js里添加：

const webpack = require('webpack');

然后在其Plugins字段里添加：

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

表示的意思是：当打包时遇到不能识别的$、jQuery 就自动去加载jquery模块。

这是全局挂载，只要用这个打包的 js 都可以使用 jquery。

当然，网上还流传另外一个方式

在入口文件中引入和挂载 jQuery，如下：

import $ from 'jquery';  //  引入 jQuery
window.$ = $;  //  挂载 jQuery
window.jQuery = $;  //  挂载 jQuery

按照上面的方式引入和挂载后就可以使用了。

但是，据说这个方法会让使用一些 jQuery 插件的时候报错。