vue.js和webpack项目中引入jquery等第三方插件的方法总结

在vue.js中也可以使用依赖dom的第三方插件， 比如jquery

引入jquery:

第一种，在模板页中用script标签引入jquery，不需要npm，在webpack.base中配置下面的忽略项，注意此种方式不能和plugin插件形式同时使用，

此种方法优点是不需要npm安装，可以使用cdn链接，或者公司统一的版本，而且不需要经过webpack编译，也利于浏览器缓存。webpack中的配置项 externals，意思是webpack要忽略编译的库，不会处理依赖关系， 直接调用。

externals: { // https://www.cnblogs.com/samli15999/p/7047968.html

jquery: 'window.$'

},

第二种是通过插件plugins来调用，一般情况应用此种方法,先npm i jquery,版本要高一点，因为低版本不支持npm规范，可能造成引入失败，然后在webpack.base中增加如下配置

plugins: [

new webpack.ProvidePlugin({

$: "jquery",

jQuery: "jquery",

jquery: "jquery",

"window.jQuery": "jquery"

})

],

实例项目可参考： https://github.com/jinghaonode/vue-vux-demo