vue-cli中使用jquery
一.安装依赖
npm install jquery --save
二.全局导入(必须先安装依赖)
第一步
在webpack.base.conf.js
里加入(新版的可能找不到这个文件,你可以npm install webpack --save-dev
进行手动安装)
var webpack = require("webpack")
第二步
在module.exports
的最后加入
plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
]
第三步
在main.js
引入
import $ from 'jquery' //你做到这一步页面中你直接使用$就是jq了
新版
直接在main.js
引入
import jquery from 'jquery' //你做到这一步页面中你直接使用$就是jq了
三.单个vue组件导入(必须先安装依赖)
然后在组件的script中
<script>
import $ from "jquery" //其实嘛你安装依赖后你在node_modlules文件中的一个文件相对路径而已
console.log($) //你可以打印瞧瞧
</script>
vue-cli中使用jquery的更多相关文章
- 在vue项目中引入jquery
在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...
- Vue组件中引入jQuery
一.安装jQuery依赖 在使用jQuery之前,我们首先要通过以下命令来安装jQuery依赖: npm install jquery --save # 如果你更换了淘宝镜像,可以使用cnpm来安装, ...
- 如何在Vue项目中引入jQuery?
假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...
- Vue Cli 中使用 Karma / Chrome 执行样式相关单元测试
在 GearCase 开源项目 中,我使用了 Vue Cli 的默认测试框架.因此和样式相关的东西,都无法进行测试.因为它并不类似于无头浏览器,而是存在于虚拟内存之中. 现状 在如下 button.s ...
- [译]怎样在Vue.js中使用jquery插件
原文:http://gambardella.info/2016/09/05/guide-how-to-use-vue-js-with-jquery-plugins 使用Vue真的太棒了,但是也有可能使 ...
- vue cli 中关于vue.config.js中chainWebpack的配置
Vue CLI 的官方文档上写:调整webpack配置最简单的方式就是在vue.config.js中的configureWebpack选项提供一个对象. Vue CLI 内部的 webpack 配置 ...
- vue-cli3搭建的vue项目中使用jquery
装包:npm install jquery --save 方式一 全局使用 1)main.js中引入 // jquery import $ from 'jquery' Vue.prototype.$ ...
- vue cli中的env详解
前言 相信使用过 vueCli 开发项目的小伙伴有点郁闷,正常开发时会有三个接口环境(开发,测试,正式),但是 vueCli 只提供了两种 development,production(不包含 tes ...
- Vue项目中使用jquery插件
1.引入jquery,并且在vue.config.js里配置 config.plugin('provide') .use(webpack.ProvidePlugin, [{ $: 'jquery', ...
- vue项目中引用jquery
1.使用npm安装 npm i jquery --S //jquery要小写 2.在package.json文件dependencies里面加入jq 3.在build文件夹的webpack.base. ...
随机推荐
- Linux常用命令 —— 进程类
service (CentOs6) 1.service 服务名 start -------------- 启动 2.service 服务名 stop ...
- flex布局笔记整理
flex布局笔记整理 了解-webkit-box 利用postcss进行css代码的向后兼容时,display:flex兼容后的代码常会带有display:-webkit-box. 部分移动端内核较低 ...
- jvm 内存溢出
堆内存溢出 堆内存中存在大量对象,这些对象都有被引用,当所有对象占用空间达到堆内存的最大值,就会出现内存溢出OutOfMemory:Java heap space 永久代溢出 类的一些信息,如类名.访 ...
- Java开发者薪资最低?程序员只能干到30岁?国外真的没有996?Intellij真的比Eclipse受欢迎?
Stack Overflow作为全球最大的程序设计领域的问答网站,每年都会出据一份开发者调查报告.近日,Stack Overflow公布了其第9次年度开发者调查报告(https://insights. ...
- 使用ajax提交的json数据,产生筹码问题
使用ajax提交的json数据,我们必须添加produces注解,如下所示.否则将会产生乱码 方法一:添加produces注解 @ApiOperation(value = "删除日志&quo ...
- Django-中间件-csrf扩展请求伪造拦截中间件-Django Auth模块使用-效仿 django 中间件配置实现功能插拔式效果-09
目录 昨日补充:将自己写的 login_auth 装饰装在 CBV 上 django 中间件 django 请求生命周期 ***** 默认中间件及其大概方法组成 中间件的执行顺序 自定义中间件探究不同 ...
- scrapy框架来爬取壁纸网站并将图片下载到本地文件中
首先需要确定要爬取的内容,所以第一步就应该是要确定要爬的字段: 首先去items中确定要爬的内容 class MeizhuoItem(scrapy.Item): # define the fields ...
- Splitting into digits CodeForce#1104A
题目链接:Splitting into digits 题目原文 Vasya has his favourite number
- Centos 6下使用cmake编译安装MariaDB
写在前面 最近在学习Maria DB,为了方便查阅,又为了将所学的知识重新的梳理,特作此随笔一篇,希望过后阅读时能有所感,也希望对大家能够有所帮助. 安装前的准备 大家都知道,在Linux上安装软件一 ...
- let与var的区别
1.let作用域局限于当前代码块 文章中//后面的均为打印结果 代码1: { var str1 = "小花"; let str2 = "小明"; console ...