一.安装依赖

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的更多相关文章

  1. 在vue项目中引入jquery

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

  2. Vue组件中引入jQuery

    一.安装jQuery依赖 在使用jQuery之前,我们首先要通过以下命令来安装jQuery依赖: npm install jquery --save # 如果你更换了淘宝镜像,可以使用cnpm来安装, ...

  3. 如何在Vue项目中引入jQuery?

    假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...

  4. Vue Cli 中使用 Karma / Chrome 执行样式相关单元测试

    在 GearCase 开源项目 中,我使用了 Vue Cli 的默认测试框架.因此和样式相关的东西,都无法进行测试.因为它并不类似于无头浏览器,而是存在于虚拟内存之中. 现状 在如下 button.s ...

  5. [译]怎样在Vue.js中使用jquery插件

    原文:http://gambardella.info/2016/09/05/guide-how-to-use-vue-js-with-jquery-plugins 使用Vue真的太棒了,但是也有可能使 ...

  6. vue cli 中关于vue.config.js中chainWebpack的配置

    Vue CLI  的官方文档上写:调整webpack配置最简单的方式就是在vue.config.js中的configureWebpack选项提供一个对象. Vue CLI 内部的 webpack 配置 ...

  7. vue-cli3搭建的vue项目中使用jquery

    装包:npm install jquery --save 方式一 全局使用 1)main.js中引入 // jquery import $ from 'jquery' Vue.prototype.$ ...

  8. vue cli中的env详解

    前言 相信使用过 vueCli 开发项目的小伙伴有点郁闷,正常开发时会有三个接口环境(开发,测试,正式),但是 vueCli 只提供了两种 development,production(不包含 tes ...

  9. Vue项目中使用jquery插件

    1.引入jquery,并且在vue.config.js里配置 config.plugin('provide') .use(webpack.ProvidePlugin, [{ $: 'jquery', ...

  10. vue项目中引用jquery

    1.使用npm安装 npm i jquery --S //jquery要小写 2.在package.json文件dependencies里面加入jq 3.在build文件夹的webpack.base. ...

随机推荐

  1. Mybatis系列(三)XML

    Mybatis系列(三)XML 1.pom.xml依赖: <?xml version="1.0" encoding="UTF-8"?> <pr ...

  2. mybatis 生成代码配置 mybatis-generator:generate 的使用详解

    一.环境 mysql+eclipse 二.代码配置 pom.xml <?xml version="1.0" encoding="UTF-8"?> & ...

  3. Redis集群的离线安装以及原理理解

    一.本文主要是记录一下Redis集群在linux系统下离线的安装步骤,毕竟在生产环境下一般都是无法联网的,Redis的集群的Ruby环境安装过程还是很麻烦的,涉及到很多的依赖的安装,所以写了一个文章来 ...

  4. FreeSql (二十二)Dto 映射查询

    适合喜欢使用 dto 的朋友,很多时候 entity 与 dto 属性名相同,属性数据又不完全一致. 有的人先查回所有字段数据,再使用 AutoMapper 映射. 我们的功能是先映射,再只查询映射好 ...

  5. Git学习-上传项目到github

    现在流行把项目代码上传到git上,今天试了好久,终于成功上传到git了,特做点笔记. 准备工作 在github上注册一个账号,创建一个仓库. 创建好仓库,得到它的地址: 开始上传 一.新建一个文件夹, ...

  6. 本地代码上传github失败常见错误

    1.上传失败 解决办法如下: 可以通过如下命令进行github与本地代码合并: git pull --rebase origin master 重新执行上传命令: git push -u origin ...

  7. celery详解

    目录 Celery详解 1.背景 2.形象比喻 3.celery具体介绍 3.1 Broker 3.2 Backend 4.使用 4.1 celery架构 4.2 安装redis+celery 4.3 ...

  8. Day 19 磁盘管理

    1.磁盘的基本概念 1.什么是磁盘 磁盘(disk)是指利用磁记录技术存储数据的存储器. 磁盘是计算机主要的存储介质,可以存储大量的二进制数据,并且断电后也能保持数据不丢失. *绝大多数人对硬盘都不陌 ...

  9. 01 (H5*) Vue第一天

    目录 1:什么是Vue.js 2:MVC和MVVM. 3:为什么要学习前段框架 4:框架和库的区别 5:怎么使用Vue. 6:常见的Vue指令 7:  五大事件修饰符 8:在vue中使用class样式 ...

  10. [Linux] Vmware 15安装CentOs后显示网络不可用

    转载自:https://blog.csdn.net/chenjin_chenjin/article/details/83617186 在虚拟机上安装好centos7后,ping www.baidu.c ...