参考原文地址:www.cnblogs.com/fps2tao/p/9…
1.NPM 安装 jQuery,项目根目录下运行以下代码
npm install jquery --save
复制代码
2.webpack配置
在项目根目录下的build目录下找到webpack.base.conf.js文件,在开头使用以下代码引入webpack,因为该文件默认没有引用。
'use strict'
const webpack = require('webpack') //这行是新增的
const path = require('path')
const utils = require('./utils')
const config = require('../config')
const vueLoaderConfig = require('./vue-loader.conf')
复制代码
然后在module.exports 最后添加一段代码,
//增加一个plugins
plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
jquery: "jquery",
"window.jQuery": "jquery"
})
]
复制代码
然后在main.js里面引入jquery
import $ from 'jquery'
复制代码
然后重新启动项目,不出意外,编译应该报错,跟下面类似:
http://eslint.org/docs/rules/no-undef '$' is not defined or
http://eslint.org/docs/rules/no-undef 'jQuery' is not defined
复制代码
3.eslint 检查
机智的朋友肯定想到跟eslint有关,没错,这时候需要做的下一步就是要修改根目录下.eslintrc.js文件了,在改文件的module.exports中,为env添加一个键值对 jquery: true 就可以了,也就是
module.exports = {
root: true,
parserOptions: {
parser: 'babel-eslint'
},
env: {
browser: true,
// 这行是新添加的
jquery: true
},
复制代码
4.eslint == 报错 [eslint] Expected '===' and instead saw '=='. (eqeqeq)
还是在根目录下.eslintrc.js修改
rules: {
// allow async-await
'generator-star-spacing': 'off',
// allow debugger during development
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
//新增这一行
"eqeqeq": 'off'
}
复制代码
所有评论(0)