vue工程化之项目引入jquery
既然写项目,那么少不了用jq,那我们就引入进来吧
1、因为已经安装了vue脚手架,所以需要在webpack中全局引入jquery
打开package.json文件,在里面加入这行代码,jquery后面的是版本,根据你自己需求更改。
dependencies:{
"jquery":"^2.2.1"
}
2、然后在命令行中cnpm install
大多人应该都是使用的淘宝镜像,所以使用cnpm,如果你不是 ,可以使用npm安装。
3、在webpack.base.conf.js中加入一行代码
var webpack=require("webpack")
4、在webpack.base.conf.js中module.exports的最后加入这行代码,
1
2
3
4
5
6
7
|
plugins: [ new webpack.optimize.CommonsChunkPlugin( 'common.js' ), new webpack.ProvidePlugin({ jQuery: "jquery" , $: "jquery" }) ] |
5、在main.js中引入,加入下面这行代码,全局引入
1
|
import $ from 'jquery' |
6、最后一步,重新跑一遍就好,控制台输入npm run dev
你会神奇的发现,jq可以用了!
vue工程化之项目引入jquery的更多相关文章
- VUE项目引入jquery
既然写项目,那么少不了用jq,那我们就引入进来吧 1.因为已经安装了vue脚手架,所以需要在webpack中全局引入jquery 打开package.json文件,在里面加入这行代码,jquery后面 ...
- vue框架(三)_vue引入jquery、bootstrap
一.vue安装jquery 1.按照之前博客的内容,新建一个vue工程. 2.在项目文件夹下,使用命令npm install jquery --save-dev 引入jquery. 3.在build/ ...
- vue-cli搭建项目引入jquery和jquery-weui步骤详解
vue简介 Vue.js 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用. Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合 ...
- vue-cli项目引入jquery和bootstrap
1.安装插件 npm install jquery --save npm install bootstrap --save npm install popper.js --save //提示框插件,b ...
- vue项目引入bootstrap、jquery
在进行vue的学习,项目中需要引入bootstrap.jquery的步骤. 一.引入jQuery 在当前项目的目录下(就是package.json),运行命令 cnpm install jquery ...
- 在vue项目中引入jquery
在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...
- 在vue项目中正确的引入jquery和bootstrap
<script>标签引入jquery在vue脚手架里并不适用,需要利用webpack引入jquery 一.第一种方法 1:因为已经安装了vue脚手架,所以需要在webpack中全局引入jq ...
- vue系列---vue项目(已安装vuex)中引入jquery
vue项目中引入jquery有很多方法,这只是其中一种. 步骤如下: 1,安装jquery依赖 npm install jquery --save 如果是使用淘宝镜像则将npm改为cnpm 2,修改配 ...
- 在vue项目中通过iframe引入jquery项目
最近公司因为原来的jq框架存在的问题太多,所以要进行主题框架的重新搭建,我使用的vue进行的主题框架的重新搭建,但是原来的页面已经完成很多了,而且都是使用的jquery进行开发的 在vue中引入jqu ...
随机推荐
- 【BZOJ 2456】 mode
[题目链接] 点击打开链接 [算法] 此题初看是大水题,只需调用std :: sort即可 但是,n最大500000,显然会超时 而且,内存限制1MB,我们连数组也开不了! 那怎么做呢 ? 我们发现, ...
- 洛谷 P1315 观光公交 —— 贪心
题目:https://www.luogu.org/problemnew/show/P1315 问题是想不明白改动一条边会对后面造成怎样的影响: 实际上影响的会是一段,当某个车站出发时间受其来人牵制时, ...
- center os 安装mysql5.6
软件 MySQL-server-5.6.13-1.el6.x86_64.rpm MySQL-client-5.6.13-1.el6.x86_64.rpm 安装命令 rpm -ivh MySQL-ser ...
- list:[::5]
0-99的数列 L = [0, 1, 2, 3, ..., 99] 所有数,每5个取一个 >>> L[::5] [0, 5, 10, 15, 20, 25, 30, 35, 40, ...
- Unity3d 应用系统分析
- vue中的列表项删除操作
<script> Vue({ data: { orders: [] }, created() { $.get( { url: 'orders', dataType: 'json' }) . ...
- bzoj 2288: 【POJ Challenge】生日礼物【链表+堆】
参考:http://blog.csdn.net/w_yqts/article/details/76037315 把相同符号的连续数字加起来,合并后ans先贪心的加上所有正数,如果正数个数sum> ...
- 爬虫—Selenium爬取JD商品信息
一,抓取分析 本次目标是爬取京东商品信息,包括商品的图片,名称,价格,评价人数,店铺名称.抓取入口就是京东的搜索页面,这个链接可以通过直接构造参数访问https://search.jd.com/Sea ...
- IP地址简单入门
------------------------针对网络地址相关的小白,最快速接触网络知识------------------------- 可以使用python自带的模块IPy,进行处理IP地址或I ...
- 使用HttpClient携带证书报错_Certificate for <IP> doesn't match any of the subject alternative names:[域名]
使用HttpClient携带pfx证书通过Https协议发送SOUP报文调用WebService接口时报如下错误: Exception in thread "main" javax ...