假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project).

在你的vue项目目录下执行:

npm install jquery --save-dev

打开 build/webpack.base.conf.js 文件并添加 plugins:

module.exports = {
plugins: [
new webpack.ProvidePlugin({
$: 'jquery',
jquery: 'jquery',
'window.jQuery': 'jquery',
jQuery: 'jquery'
})
]
...
}

在文件顶部添加

const webpack = require('webpack')

如果你有在使用eslint, 打开 .eslintrc.js  文件添加 global 项

module.exports = {
globals: {
"$": true,
"jQuery": true
},
...

现在你可以在vue项目中随意使用$了

PS: 此方法不需要额外的类似 expose loader 等的插件

如何在Vue项目中引入jQuery?的更多相关文章

  1. 在vue项目中引入jquery

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

  2. 详解如何在vue项目中引入饿了么elementUI组件

    在开发的过程之中,我们也经常会使用到很多组件库:vue 常用ui组件库:https://blog.csdn.net/qq_36538012/article/details/82146649 今天具体说 ...

  3. 如何在vue项目中引入elementUI组件

    个人博客同步文章 https://mr-houzi.com/2018/02/... 前提:已经安装好Vue 初始化vue vue init webpack itemname 运行初始化demo 运行一 ...

  4. 如何在vue项目中引入element-ui

    安装 elementUI npm install element-ui --save 引入elementUI import ElementUI from 'element-ui' import 'el ...

  5. 如何在vue项目中引入阿里巴巴的iconfont图库

    1. 打开 http://www.iconfont.cn/ 2. 选择我们喜欢的图标,点击上面的小车,加入图标库,即右侧的购物车 3.点击购物车,点击下载代码 4.解压下载的文件夹,将文件夹复制到 a ...

  6. vue项目中引入Sass

    Sass作为目前成熟,稳定,强大的css扩展语言,让越来越多的前端工程师喜欢上它.下面介绍了如何在vue项目 中引入Sass. 首先在项目文件夹执行命令 npm install vue-cli -g, ...

  7. 如何在Vue项目中给路由跳转加上进度条

    1.前言 在平常浏览网页时,我们会注意到在有的网站中,当点击页面中的链接进行路由跳转时,页面顶部会有一个进度条,用来标示页面跳转的进度(如下图所示).虽然实际用处不大,但是对用户来说,有个进度条会大大 ...

  8. 前端学习笔记系列一:10整体移动vscode代码块、VSCode 使用 stylus,配置格式化设置、在vue项目中引入bootstrap

    1.整体移动vscode代码块 凭借操作的经验我们能够轻松地知道将代码整体往右移只需选中代码按Tab键即可.其实往左移也很简单: 选中之后按下 shift+Tab键 即可. 2.VSCode 使用 s ...

  9. 如何在VUE项目中添加ESLint

    如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...

随机推荐

  1. 市场不相信眼泪:AI第一股暴力裁员 惨了

    近日,有网友在社交平台匿名爆料称,科大讯飞准备优化30%的正式员工. 还有人匿名爆料,科大讯飞无补助报销出差加班,迫使员工离职,并将矛头指向了一个叫“黄狗子”“黄国庆”的角色. 有媒体猜测,科大讯飞采 ...

  2. Vue2 第二天学习

    个人小总结:1年多没有写博客,感觉很多知识点生疏了,虽然工作上能解决问题,但是当别人问到某个知识点的时候,还是迷迷糊糊的,所以坚持写博客是硬道理的,因为大脑不可能把所有的知识点记住,有可能某一天忘了, ...

  3. PAT A1140 Look-and-say Sequence (20 分)——数学题

    Look-and-say sequence is a sequence of integers as the following: D, D1, D111, D113, D11231, D112213 ...

  4. Spring对JSON请求加解密

    Spring中处理JSON请求通常使用@RequestBody和@ResponseBody注解,针对JSON请求加解密和过滤字符串,Spring提供了RequestBodyAdvice和Respons ...

  5. 如何传递参数给ASP.NET Core的中间件(Middleware)

    问题描述 当我们在ASP.NET Core中定义和使用中间件(Middleware)的时候,有什么好的办法可以给中间件传参数吗? 解决方案 在ASP.NET Core项目中添加一个POCO类来传递参数 ...

  6. 【强化学习】python 实现 q-learning 迷宫通用模板

    本文作者:hhh5460 本文地址:https://www.cnblogs.com/hhh5460/p/10145797.html 0.说明 这里提供了二维迷宫问题的一个比较通用的模板,拿到后需要修改 ...

  7. dp入门——由分杆问题认识动态规划

    简介 如果你常刷leetcode,会发现许多问题带有Dynamic Programming的标签.事实上带有dp标签的题目有115道,大部分为中等和难题,占所有题目的12.8%(2018年9月),是占 ...

  8. CSS 尺寸 (Dimension) 实例

    CSS 尺寸 (Dimension) 实例CSS 尺寸属性CSS 尺寸属性允许你控制元素的高度和宽度.同样,还允许你增加行间距. 属性 描述height 设置元素的高度.line-height 设置行 ...

  9. 索引节点(inode)爆满问题处理

    关于磁盘空间中索引节点爆满的问题还是挺多的,借此跟大家分享几个情况: 情况一 在公司一台配置较低的Linux服务器(内存.硬盘比较小)的/data分区内创建文件时,系统提示磁盘空间不足,用df -h命 ...

  10. nginx try_files 详解

    server { listen ; server_name localhost; index index.html index.htm index.php; root /data/wwwroot; l ...