vue+eslint+vscode配置教程


Posted in Javascript onAugust 09, 2019

package.json文件所需要的eslint包

"scripts": {
  "lint": "eslint --ext .js,.vue src",
 },
"devDependencies": {
  "babel-eslint": "^8.2.1",
  "eslint": "^4.15.0",
  "eslint-config-airbnb-base": "^11.3.0",
  "eslint-config-standard": "^13.0.1",
  "eslint-friendly-formatter": "^3.0.0",
  "eslint-import-resolver-webpack": "^0.8.3",
  "eslint-loader": "^1.7.1",
  "eslint-plugin-html": "^4.0.0",
  "eslint-plugin-import": "^2.7.0",
  "eslint-plugin-node": "^9.1.0",
  "eslint-plugin-promise": "^4.2.1",
  "eslint-plugin-standard": "^4.0.0",
  "eslint-plugin-vue": "^5.0.0-beta.6",
  }

执行npm install安装好这些依赖包

在项目中添加两个文件

.eslintrc.js
module.exports = {
 "extends": [
  // "standard",
  "plugin:vue/base"
 ],
 "env": {
  "browser": true,
  "commonjs": true,
  "es6": true
 },
 "parser": "babel-eslint",// 使用babel进行编译,解决import报错:error Parsing error: Unexpected token import
 "plugins": [
  "html"
 ],//插件,此插件用于识别文件中的js代码,没有MIME类型标识没有script标签也可以识别到,因此拿来识别.vue文件中的js代码
 // "extends": "eslint:recommended",//eslint默认推荐规则这里作了注释,使用我们定义的规则
 "parserOptions": {
  "sourceType": "module",
  "ecmaVersion": 7,
 },
"rules": {
   //这里自定义规则,规则地址:
   //http://eslint.cn/docs/rules/
 }
}
.eslintignore

自行配置eslint检查时所忽略的文件

vue+eslint+vscode配置教程

完成后在目录中的结果

vue+eslint+vscode配置教程

vscode+eslint配置

我这里是使用vscode进行检查因此还需配置vscode与eslint插件

在vscode中下载并且安装eslint插件

vue+eslint+vscode配置教程

打开vscode的Perferences->settings 

vue+eslint+vscode配置教程

点击右上角的{}进入settings.json页面

{
  "explorer.confirmDelete": false,
  "editor.formatOnType": true,
  "editor.formatOnSave": true,
  "eslint.autoFixOnSave": true, //保存自动修复eslint错误
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "html",
    "vue",
    {
      "language": "vue",
      "autoFix": true
    }
  ],
  "eslint.options": { //指定eslint配置文件位置
    "configFile": ".eslintrc.js" //指定项目根目录中的eslint配置文件
  },
  "files.autoSave": "off",
}

结束

最后终于可以愉快地配置你们项目中所需要的eslint规则啦!

总结

以上所述是小编给大家介绍的vue+eslint+vscode配置教程,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
JQuery从头学起第二讲
Jul 04 Javascript
学习从实践开始之jQuery插件开发 菜单插件开发
May 03 Javascript
jQuery简单验证上传文件大小及类型的方法
Jun 02 Javascript
JavaScript基于原型链的继承
Jun 22 Javascript
用AngularJS的指令实现tabs切换效果
Aug 31 Javascript
深入理解Javascript箭头函数中的this
Feb 13 Javascript
微信小程序slider组件使用详解
Jan 31 Javascript
Koa2 之文件上传下载的示例代码
Mar 29 Javascript
基于jQuery实现可编辑的表格
Dec 11 jQuery
vue Treeselect 树形下拉框:获取选中节点的ids和lables操作
Aug 15 Javascript
vue中defineProperty和Proxy的区别详解
Nov 30 Vue.js
vue el-upload上传文件的示例代码
Dec 21 Vue.js
一个手写的vue放大镜效果
Aug 09 #Javascript
详解Vue-cli3.X使用px2rem遇到的问题
Aug 09 #Javascript
微信小程序引入模块中wxml、wxss、js的方法示例
Aug 09 #Javascript
小程序Request的另类用法详解
Aug 09 #Javascript
一篇文章弄懂javascript中的执行栈与执行上下文
Aug 09 #Javascript
vue中组件通信的八种方式(值得收藏!)
Aug 09 #Javascript
Vue全局loading及错误提示的思路与实现
Aug 09 #Javascript
You might like
php打印一个边长为N的实心和空心菱型的方法
2015/03/02 PHP
php 常用的系统函数
2017/02/07 PHP
用jscript启动sqlserver
2007/06/21 Javascript
JQUERY复选框CHECKBOX全选,取消全选
2008/08/30 Javascript
javascript重写alert方法的实例代码
2013/03/29 Javascript
js算法中的排序、数组去重详细概述
2013/10/14 Javascript
js如何判断不同系统的浏览器类型
2013/10/28 Javascript
JS实现浏览器状态栏显示时间的方法
2015/10/27 Javascript
JS实现网页每隔3秒弹出一次对话框的方法
2015/11/09 Javascript
Javascript BOM学习小结(六)
2015/11/26 Javascript
javascript获取wx.config内部字段解决微信分享
2016/03/09 Javascript
JavaScript学习笔记之创建对象
2016/03/25 Javascript
bootstrapValidator自定验证方法写法
2016/12/01 Javascript
谈谈JS中的!!
2017/12/07 Javascript
详解Vue Elememt-UI构建管理后台
2018/02/27 Javascript
vue 设置路由的登录权限的方法
2018/07/03 Javascript
chosen实现省市区三级联动
2018/08/16 Javascript
react在安卓中输入框被手机键盘遮挡问题的解决方法
2018/09/03 Javascript
详解基于node.js的脚手架工具开发经历
2019/01/28 Javascript
Python版的文曲星猜数字游戏代码
2013/09/02 Python
详解MySQL数据类型int(M)中M的含义
2016/11/20 Python
利用python解决mysql视图导入导出依赖的问题
2017/12/17 Python
Python+tkinter使用80行代码实现一个计算器实例
2018/01/16 Python
django解决订单并发问题【推荐】
2019/07/31 Python
python对Excel按条件进行内容补充(推荐)
2019/11/24 Python
Tensorflow加载Vgg预训练模型操作
2020/05/26 Python
机电一体化应届生求职信范文
2014/01/24 职场文书
成人继续教育实施方案
2014/03/01 职场文书
信息技术毕业生自荐信范文
2014/03/13 职场文书
端午节寄语2015
2015/03/23 职场文书
国富论读书笔记
2015/06/26 职场文书
幼儿园保育员随笔
2015/08/14 职场文书
前端学习——JavaScript原生实现购物车案例
2021/03/31 Javascript
Java SSM配置文件案例详解
2021/08/30 Java/Android
一次MySQL启动导致的事故实战记录
2021/09/15 MySQL
鲲鹏 CentOS 7 安装Python3.7
2022/05/11 Servers