vue 全局引入 jquery

vue 全局引入 jquery,第1张

第一步、在项目中npm安装JQ

    npm install jquery --save

第二步、检查是否安装成功

               在package.json中的dependencies查看是否含有jquery

第三步、配置JQ

               在vue.config.js中顶部写入 const webpack = require('webpack')

               写入后在configureWebpack中加入

第四步、重启项目,引入成功

安装 jQuery 和 cropper.js

# install jQuery &cropper

$ npm install jquery cropper --save

为jquery和Vue自定义指令配置webpack

为webpack配置添加jquery和Vue自定义指令的映射。

通常webpack已经引入了完整的jquery版本,但还是建议再一次引入一下。

您可以看到Vue的webpack模板已经添加到组件的文件夹中。我通常会添加很多其他文件夹像自定义指令,mixin等等。在这个例子中,我们只添加了自定义指令。

这将帮助我们引入依赖关系而无需知道其确切的路径。这也是有益的在你重构你的应用的时候。你也并不需要管理相对路径。

把下面高亮部分添加到build/webpack.base.conf文件中。

resolve: {

extensions: ['', '.js', '.vue'],

fallback: [path.join(__dirname, '../node_modules')],

alias: {

'src': path.resolve(__dirname, '../src'),

'assets': path.resolve(__dirname, '../src/assets'),

'components': path.resolve(__dirname, '../src/components'),

'jquery': path.resolve(__dirname, '../node_modules/jquery/src/jquery'),

'directives': path.resolve(__dirname, '../src/directives')

}

},


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/bake/11410102.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-15
下一篇2023-05-15

发表评论

登录后才能评论

评论列表(0条)

    保存