如何在vue-cli webpack中全局引入jquery
1.首先执行:npm install jQuery --save-dev,在package.json里加入jQuery。
2.修改build下的webpack.base.conf.js
方法一:
首先加入:
const webpack = require("webpack")
然后在module.exports 对象中加入:

plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
]
方法二:
先加入:
const webpack = require("webpack")
然后:
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'vue$': 'vue/dist/vue.esm.js',
'@': resolve('src'),
'jquery': 'jquery'
}
},
最后:
plugins: [
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
]
3.在app.vue中调用jquery
mounted: function() {
console.log($);
console.log($('#ss')[0].innerHTML);
},
打印结果:

如何在vue-cli webpack中全局引入jquery的更多相关文章
- vue-cli webpack 中全局引入 jquery
1.安装 jquery npm install jquery --save-dev 2.修改 webpack.base.conf.js 方法一 首先加入: const webpack = requir ...
- vue cli web pack 全局引入jquery
之前 装过,装 npm i —save jquery 然后直接执行了第二步 往后 1,首先在 package.json 里加入, 然后 npm install 2, 在webpack.base.c ...
- 在Vue的webpack中结合runder函数
在Vue的webpack中结合runder函数 1.引入: <h1>下面是vue的内容:</h1> <div id="app"> <log ...
- 如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件
copy内容的网址: https://segmentfault.com/a/1190000007020623 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要 ...
- 如何在 vue 项目里正确地引用 jquery
转载 2016年11月13日 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要修改的是build/webpack.base.conf.js,修改两处的代码 / ...
- 如何在 vue 2.0+ 中引入全局的stylus文件,且能正常
由于stylus在引用时,不能像一般的css文件直接在main.js中引用,就算引用了也会只能使用转换后的css,不能使用里面的函数,方法等,原因可能是:在这里引入会被直接编译成css,不能在别的模板 ...
- Vue CLI 3 中文文档
翻译文档 文档翻译全貌 前言 之前写了一篇Vue CLI 3.x 版本的简单体验,当时文档还不全,具体的使用方法并不是很清楚,大概是2月7号,收到Vue CLI 3接近Beta版的提示,作者尤雨溪也讲 ...
- vue-cli3项目中全局引入less sass文件 以及使用本地图片在不同地方规则
第一种直接在main.js中引入,需要声明loader demo: import '!style-loader!css-loader!less-loader!./assets/css/common.l ...
- vue+vuecli+webpack中使用mockjs模拟后端数据
前言 使用mockjs可以事先模拟数据,前提是和后端约定好了数据接口,怎样的数据.使用mock就可以生成你要的数据了,从而实现开发时前后端分离. 其主要功能是: 基于数据模板生成模拟数据. 基于HTM ...
随机推荐
- Tomcat在Linux服务器上的BIO、NIO、APR模式设置
一.BIO.NIO.AIO 先了解四个概念: 同步 : 自己亲自出马持银行卡到银行取钱(使用同步IO时,Java自己处理IO读写). 异步 : 委托一小弟拿银行卡到银行取钱,然后给你(使用异步IO时, ...
- mysql新建数据库,并设置charset为utf8,使用utf8_general_ci字符集校验结果
一. 实现功能 有时候在linux服务器端, 会在mysql命令行中, 创建数据库, 今天讲一下怎么在创建数据库时, 把charset设置为utf8,collate设置为utf8_general_ci ...
- idea svn 的使用----转载,挺好的
Intellij IDEA svn的使用记录 这里的忽略一直灰色的,可以进入 这里的版本控制里进行忽略选择 或者 这里进行添加 这里有三个选择 按照顺序 1.忽略指定的文件 2.忽略文件夹下所有文件 ...
- 《程序员的职业素养》【PDF】下载
<程序员的职业素养>[PDF]下载链接: https://u253469.pipipan.com/fs/253469-230382243 内容介绍 <程序员的职业素养>是编程大 ...
- 【正则表达式】匹配时间格式:hh:mm或h:m
^(0?[0-9]|1[0-9]|2[0-3]):(0?[0-9]|[1-5][0-9])$
- IOS学习5——属性与成员变量
[转]iOS中属性与成员变量的区别 ios中属性修饰符的作用 1. 属性用property声明 2. 简而言之,对于目前的ios开发,属性和成员变量的区别,完全可以不管. 3. 这个是历史原因造成的. ...
- 云储存第三方--阿里云OSS VS 又拍云USS
p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "Helvetica Neue"; color: #454545 } p. ...
- iOS 进阶—— iOS 内存管理
1 似乎每个人在学习 iOS 过程中都考虑过的问题 alloc retain release delloc 做了什么? autoreleasepool 是怎样实现的? __unsafe_unretai ...
- bzoj 4765: 普通计算姬
Description "奋战三星期,造台计算机".小G响应号召,花了三小时造了台普通计算姬.普通计算姬比普通计算机要厉害一些 .普通计算机能计算数列区间和,而普通计算姬能计算树中 ...
- ActiveMQ (三) 讯息传送机制以及ACK机制
详析请看如下博客: http://blog.csdn.net/lulongzhou_llz/article/details/42270113 后续再做整理.