在vue项目里使用jquery
1.NPM 安装 jQuery,项目根目录下运行以下代码
npm install jquery --save
2.webpack配置
在项目根目录下的build目录下找到webpack.base.conf.js文件,在开头使用以下代码引入webpack,因为该文件默认没有引用,
var webpack = require('webpack')
然后在module.exports中添加一段代码,
// 原有代码 resolve: { extensions: ['.js', '.vue', '.json'], alias: { 'vue$': 'vue/dist/vue.esm.js', '@': resolve('src') } }, // 添加代码 plugins: [ new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery", jquery: "jquery", "window.jQuery": "jquery" }) ], // 原有代码 module: { rules: [ // ...... ] }
main.js里导入jQuery
import 'jquery'
最后启动项目 npm run dev即可
在vue项目里使用jquery的更多相关文章
- 脚手架搭建的vue项目里引入jquery和bootstrap
引入jquery: 1.在cmd输入:npm install jquery,回车,等待.. 2.在webpack.base.conf.js里进行如下操作: 3.在webpack.prod.conf.j ...
- 如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件
copy内容的网址: https://segmentfault.com/a/1190000007020623 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要 ...
- 如何在 vue 项目里正确地引用 jquery
转载 2016年11月13日 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要修改的是build/webpack.base.conf.js,修改两处的代码 / ...
- 项目里的jquery.min.js错误
项目里的jquery.min.js报一系列 - Missing semicolon - Missing semicolon - Missing semicolon - Missing semicolo ...
- 在vue项目中引入jquery
在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...
- vue 项目里正确地引用 jquery
一.NPM安装的jQuery 使用vue-cli构建的vue项目,需要修改的是build/webpack.base.conf.js 1.添加引入webpack,后面的plugins那里需要 const ...
- 如何在Vue项目中引入jQuery?
假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...
- Vue项目中使用jquery插件
1.引入jquery,并且在vue.config.js里配置 config.plugin('provide') .use(webpack.ProvidePlugin, [{ $: 'jquery', ...
- vue项目如何引用jquery
虽然vue不推荐直接操作DOM,而且也提供了操作DOM的方式.但是在某些时候还是要用到jquery,那么如何引入jquery呢? 费了半天劲,记录一下: 一 : 安装jquery npm instal ...
随机推荐
- docker占满linux磁盘根目录的解决办法
一.磁盘根目录被占满 [test@localhost docker]$ df -lh Filesystem Size Used Avail Use% Mounted on /dev/mapper/ce ...
- Linux-task_struct和文件系统及管道的关系
推荐:文件描述符和文件指针的关系 fs_struct 记录该进程所在文件系统等信息. files_struct 记录该进程当前打开的所有文件等信息,其中有一个元素为数组,数组索引是文件描述符,数组元素 ...
- 【Apache】Apache的安装和配置
Apache是世界非常流行的Web服务器软件.它可以运行在几乎所有广泛使用的计算机平台上,由于其跨平台和安全性被广泛使用,是最流行的Web服务器端软件之一. Apache在Win7上的安装 下载apa ...
- LaTeX中的各种距离设置总结
LaTeX中的各种距离设置总结 1. 页面设置 A4 会给你一个较小的页面,为了使用更多的控制,可用 geometry宏包 和 命令 \layout . 2. 改变长度 在latex里改变长度 ...
- tensorflow 笔记13:了解机器翻译,google NMT,Attention
一.关于Attention,关于NMT 未完待续... 以google 的 nmt 代码引入 探讨下端到端: 项目地址:https://github.com/tensorflow/nmt 机器翻译算是 ...
- 程序猿必备的10款超炫酷HTML5 Canvas插件
1.超炫酷HTML5 Canvas 3D旋转地球动画 这是一款基于HTML5 Canvas的3D地球模拟动画,动画以太空作为背景,地球在太空中旋转,同时我们也可以拖拽鼠标来从不同的角度观察地球.另外我 ...
- 【nodejs】exports 和 module.exports 的区别
require 用来加载代码,而 exports 和 module.exports 则用来导出代码.但很多新手可能会迷惑于 exports 和 module.exports 的区别,为了更好的理解 e ...
- css3图片处理方式 object-fit
.fill { object-fit: fill; } .contain { object-fit: contain; } .cover { object-fit: cover; } .none { ...
- springboot-thymeleaf
Thymeleaf 是一个跟 Velocity.FreeMarker 类似的模板引擎,它可以完全替代 JSP .相较与其他的模板引擎,它有如下三个极吸引人的特点: Thymeleaf 在有网络和无网络 ...
- 用xstart远程连接linux图形用户界面
转载:https://blog.csdn.net/yabingshi_tech/article/details/51839379 双击xstart 输入:/usr/bin/xterm -ls -dis ...