详解如何在vue项目里正确地引用jquery和jquery ui的插件 - 行业资讯

使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要修改的是构建/webpack.base.conf.js,修改两处的代码

　　　　//在开头引入webpack,后面的插件那里需要　　var webpack=要求(“webpack”)//解决　　　　模块。出口={//其他代码…… 　　解决:{ 　　扩展:[",”。js”、“.vue”), 　　回退:[路径。加入(__dirname“. ./node_modules”), 　　别名:{ 　　“src”:路径。解决(__dirname“. ./src”), 　　“资产”:路径。解决(__dirname“. ./src/资产”), 　　“组件”:路径。解决(__dirname“. ./src/组件”),//webpack使用jQuery,如果是自行下载的//癹query”:路径。解决(__dirname“. ./src/资产/libs/jquery/jquery.min '),//如果使用NPM安装的jQuery 　　“jquery”:“jquery” 　　} 　　}，//增加一个插件　　插件:[ 　　新webpack.ProvidePlugin ({ 　　美元:“jquery”, 　　jQuery:“jQuery” 　　}）　　),//其他代码…… 　　} 　　之前　　　　

这样就可以正确的使用jQuery了,比如我要引入<代码>引导> src/main.js 开头加入

　　　　//使用引导　　进口的。/资产/libs/引导/css/bootstrap.min.css ' 　　进口的。/资产/libs/引导/js/bootstrap.min ' 　　　　

这样引导就正确的被引用并构建。
　　

在比如使用toastr组件,只需要在需要的地方进口进来,或者全局引入css在需要的地方引用js,然后直接使用

　　　　//使用toastr 　　导入“资产/libs/toastr/toastr.min.css” 　　从资产/libs/toastr/进口toastr toastr.min” 　　　　toastr.success(“你好”) 　　之前　　　　

<强> vue-cli webpack全局引入jquery
　　

1,首先在<代码>包。json代码里加入,
　　

　　　　　　依赖性:{ 　　“jquery”:“^ 2.2.3” 　　} 　　　　

然后nmp安装
　　

2,在<代码> webpack.base.conf。js代码里加入
　　

　　　　　　var webpack=要求(“webpack”) 　　　　

3,在模块。出口的最后加入
　　