注意这里配置的是vue-cli3.0引入jquery的方法，不是vue-cli2.0的配置方法

一、安装jquery

npm install jquery --save

二、一般安装成功后在package.json文件内的dependencies项中会有"jquery": "^1.12.4"，如果没有可以手动添加。需要注意的是，现在我们都是直接使用模板创建项目的，所以第一步是可以省略的(不要说我第二步才说第一步可以省略，这是你自己的问题，看任何东西都是先看了再去做的)。

三、打开.eslintrc.js 文件，找到env ，在里面 添加 jquery:true，默认应该是只有node:true，如果都没有，那就加上env呗

四、打开vue.config.js 文件，在文件的头部位置加上const webpack = require('webpack')，然后在module.exports中，添加

configureWebpack: {

plugins: [

new webpack.ProvidePlugin({

$:"jquery",

jQuery:"jquery",

"windows.jQuery":"jquery"

})

]

}

这一步骤类似vue-cli2.0的配置方法

五、在main.js中添加“import $ from 'jquery”，到此步，jquery的配置就完成了

vue/cli 3 引入 使用jQuery的更多相关文章

  1. vue系列之vue cli 3引入ts

    插件 Vue2.5+ Typescript 引入全面指南 vue-class-component强化 Vue 组件,使用 TypeScript/装饰器 增强 Vue 组件 vue-property-d ...

  2. 脚手架搭建的vue项目里引入jquery和bootstrap

    引入jquery: 1.在cmd输入:npm install jquery,回车,等待.. 2.在webpack.base.conf.js里进行如下操作: 3.在webpack.prod.conf.j ...

  3. 在vue项目中引入jquery

    在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...

  4. vue cli 3 +jquery

    const webpack = require('webpack')module.exports = { // baseUrl type:{string} default:'/' // 将部署应用程序 ...

  5. vue -- 正确的引入jquery

    虽然vue中尽量不要使用jquery,但有时因为业务需求也不得不引入. 下载依赖 npm i jquery --save 全局配置的方法: 在webpack.base.conf.js里加入: var ...

  6. 每天一点点之vue框架开发 - 引入Jquery

    1. 安装jquery npm install jquery --save-dev 2.在build/webpack.base.conf.js中添加如下内容 var webpack = require ...

  7. vue cli 3.x 项目部署到 github pages

    github pages 是 github 免费为用户提供的服务,写博客,或者部署一些纯静态项目. 最近将 vue cli 3.x 初始化项目部署到 github pages,踩了一些坑,记录如下. ...

  8. @vue/cli 3.0 使用 svg-sprite-loader 加载本地 SVG 文件

    目录 @vue/cli 3.0 使用 svg-sprite-loader 加载本地 SVG 文件 运行 使用 配置 svg-sprite-loader 调用当前环境下的颜色 props @vue/cl ...

  9. Vue CLI 3使用：浏览器兼容性

    package.json 文件里的 browserslist 字段 (或一个单独的 .browserslistrc 文件),指定了项目的目标浏览器的范围.这个值会被 @babel/preset-env ...

随机推荐

  1. Python实现简单框架及三大框架对比

    手撸web框架 简单的请求响应实现 要实现最简单的web框架,首先要对网络熟悉,首先HTTP协议是应用层的协议,只要我们给数据加上HTTP格式的响应报头,我们的数据就能基于socket进行实现了 im ...

  2. js抽奖概率随机取出数据(简单示例)

    在平常活动开发当中,经常会碰到抽奖等类似的js功能,那么下面我们随机取数组中的一条来展示出来. ( 一 ) 无概率问题 var gift_ = ['apple pro一台','iphoneX一台',' ...

  3. css6——通栏平均分布

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  4. 西瓜哥：公有云也“All-Flash”?

    本文转载自 高端存储知识 Gartner在2018年Market Insight: Preparing for the SSD Rise and HDD Demise一文中指出:当闪存介质降到HDD每 ...

  5. ansible批量管理常见的配置方法

    第7章 ansible的管理 7.1 ansible概念的介绍 ansible-playbook –syntax            检查语法 ansible-playbook -C         ...

  6. .net core 在服务端限制文件下载速度（传输速度）

    public IActionResult GetFile() { MyFileStream readStream = new MyFileStream(@"XXX/A.XX", F ...

  7. 分布式算法-一致性HASH

    分布式算法 参考: https://blog.51cto.com/alanwu/1431397 https://blog.csdn.net/kojhliang/article/details/8120 ...

  8. HTML5变化

    HTML5变化 新的语义化元素 header footer nav main article section 删除了一些纯样式的标签 表单增强 新API 离线 (applicationCache ) ...

  9. 一篇文章看清楚JDK13的特性！

    1.switch优化更新 JDK11以及之前的版本: switch (day) { case MONDAY: case FRIDAY: case SUNDAY: System.out.println( ...

  10. Test1016

    T1 kom (容斥 \((1s32M)\) 给出\(N\)个互不相同的正整数,统计共有多少对数,它们有公共的一个数字(不一定在同一位置上) 输入 第一行一个正整数 \(N (1 ≤ N ≤ 1 00 ...