在vue项目中正确的引入jquery
1:因为已经安装了vue脚手架,所以需要在webpack中全局引入jquery
打开package.json文件,在里面加入这行代码,jquery后面的是版本,根据你自己需求更改。
dependencies:{
"jquery":"^2.2.3"
}
然后在命令行中cnpm install
大多人应该都是使用的淘宝镜像,所以使用cnpm,如果你不是 ,可以使用npm安装。
2:在webpack.base.conf.js中加入一行代码
var webpack=require("webpack")
3:在webpack.base.conf.js中module.exports的最后加入这行代码,
plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
]
4:在main.js中引入,加入下面这行代码
import $ from 'jquery'
5:最后一步,重新跑一边就好,cnpm run dev
以上方法我自己试过了,确认可以正常使用,如果有不对的地方欢迎联系我进行改正。
在vue项目中正确的引入jquery的更多相关文章
- 在vue项目中正确的引入jquery和bootstrap
<script>标签引入jquery在vue脚手架里并不适用,需要利用webpack引入jquery 一.第一种方法 1:因为已经安装了vue脚手架,所以需要在webpack中全局引入jq ...
- 在vue项目中通过iframe引入jquery项目
最近公司因为原来的jq框架存在的问题太多,所以要进行主题框架的重新搭建,我使用的vue进行的主题框架的重新搭建,但是原来的页面已经完成很多了,而且都是使用的jquery进行开发的 在vue中引入jqu ...
- 如何在 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项目中设置全局引入scss,使每个组件都可以使用变量
在Vue项目中使用scss,如果写了一套完整的有变量的scss文件.那么就需要全局引入,这样在每个组件中使用. 可以在mian.js全局引入,下面是使用方法. 1: 安装node-sass.sass- ...
- vue 项目里正确地引用 jquery
一.NPM安装的jQuery 使用vue-cli构建的vue项目,需要修改的是build/webpack.base.conf.js 1.添加引入webpack,后面的plugins那里需要 const ...
- vue-cli项目中,全局引入jquery
命令行执行 npm install --save jquery 找到webpack.base.conf.js文件,写入代码: const webpack = require('webpack') 在m ...
- 在vue项目中引入jquery
在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...
- 如何在Vue项目中引入jQuery?
假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...
随机推荐
- 【LGP4714】「数学」约数个数和
题目 众所周知,除数个数函数\(\sigma_0=I^2\),\(I\)就是狄利克雷卷积里的\(1\)函数 于是熟悉狄利克雷卷积的话很快就能看出我们要求的就是\(I\times I^{k}\),即\( ...
- input 不显示输入的历史记录
第一次在 input 输入后,下次就会自动显示输入历史记录,去掉这种默认效果的解决方案 <input name="username" type="text" ...
- mysqldump使用记录
#导出单个数据库:结构 无数据 [root@localhost ~]#mysqldump -h127.0.0.1 -uroot -p --opt --no-data db_name >~/db_ ...
- WPF 多语言
1.http://www.cnblogs.com/bear831204/archive/2009/03/17/1414026.html 2.http://www.cnblogs.com/horan/a ...
- thinkphp 自动验证
自动验证是ThinkPHP模型层提供的一种数据验证方法,可以在使用create创建数据对象的时候自动进行数据验证. 大理石平台价格表 验证规则 数据验证可以进行数据类型.业务规则.安全判断等方面的验证 ...
- csps模拟测试707172部分题解myc
题面:https://www.cnblogs.com/Juve/articles/11678524.html 骆驼:构造题,留坑 根据5×5的矩形构造成大矩形 毛一琛: mid in the midd ...
- php构造方法(函数)基础
什么是构造函数呢?在回答这个问题之前,我们来看一个需求:我们在创建人类的对象时,是先把一个对象创建好后,再给他的年龄和姓名属性赋值,如果现在我要求,在创建人类的对象时,就指定这个对象的年龄和姓名,该怎 ...
- PAT甲级——A1002 A+B for Polynomials
This time, you are supposed to find A+B where A and B are two polynomials. Input Specification: Each ...
- java浮点运算的陷阱
首先呢,i你要明白double和float. Inifinity: 例如:syso(5.0/0.0+" 和"+0.0 /0.0); 浮点运算的0.0不是真正意义上的0,而是非常接近 ...
- python数据类型初始1
int: 1,2,3就是用于计算. bool:主要是用于判断,True,False str:用引号引起来的,'dsldgau','张三'.主要用于储存少量数据,进行操作 list(列表):[1,2,3 ...