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 ...
随机推荐
- MFC绘图
//20171/121 两点一线 比如鼠标左击和鼠标弹起的两个消息 然后响应从而获取一条线2 添加响应函数方法 类图->右击->addwindowsmessage3 Dview和main中 ...
- Rebel 6 破解版及使用方法
下载地址:http://www.zeroturnaround.com/jrebel/download/ 下载下来的是一个Zip压缩包,打开之后会发现一个jrebel.jar,这就是其最重要的运 ...
- 用set和shopt设置bash选项
1.set命令 -o打开选项,+o关闭选项#set -o //显示选项设置#set -o noclobber //打开该选项,重定向将覆盖已存在的文件#set +o noclobber //关闭该选项 ...
- 设置Google搜索在新的标签页打开
Google搜索的结果,默认情况下点击进入是在本标签页打开的,这样就很麻烦, 可以在搜索结果的页面中进行设置,让它在新的标签页显示 搜索结果设置->搜索设置->新的标签页打开
- BOA服务器搭建步骤
1.下载Boa Webserver的源码 http://www.boa.org/ 2.解压并编译Boa Webserver $ tar xvf boa-0.94.13.tar.gz 由于Boa Web ...
- DBMS "无法作为数据库主体执行,因为主体“dbo”不存在、无法模拟这种..........”
解决方案: 新附加的数据库需要设置所有者才能建立数据库关系图.供参考的操作步骤如下: 选择“AdventureWorks2012LT”,右键,选择“属性”,选择“文件”页,点击“所有者”右侧按钮,点击 ...
- JavaScript--DOM浏览器窗口可视区域大小
浏览器窗口可视区域大小 获得浏览器窗口的尺寸(浏览器的视口,不包括工具栏和滚动条)的方法: 一.对于IE9+.Chrome.Firefox.Opera 以及 Safari: • window.inn ...
- flask框架模板系统
flask模板引擎 flask默认使用了Jinja2模板引擎,我们在使用模板的时候,需要在同级目录文件夹下 创建一个templates的文件夹,然后这个文件夹内放置我们想要的模板实例即可: 在正常普通 ...
- [ZPG TEST 110] 多边形个数【DP】
1. 多边形个数 (polygons.pas/c/cpp) [问题描述] 给定N线段,编号1到n.并给出这些线段的长度,用这些线段组成一个K边形,并且每个线段做多使用一次.若使用了一条不同编号的线段, ...
- ACM_查找ACM(加强版)
查找ACM(加强版) Time Limit: 2000/1000ms (Java/Others) Problem Description: 作为一个acmer,应该具备团队合作能力和分析问题能力.给你 ...