配置eslint规范项目代码风格
2019-03-28 11:00
337 查看
为什么要使用eslint
你在接手一个项目的维护迭代任务,阅读代码的时候是否会因为项目中充斥着各种风格的代码而感到头疼?没错,eslint就是为了解决这类问题
eslint能做什么?
1.代码风格错误提示
配置好eslint后,如果代码风格与配置描述的不符,eslint会提示代码中存在的风格问题;一般提示的情形有:
1.编辑器内,大多数编辑器配置好后能读取eslint配置文件并在文件中进行相应提示
2.eslint-loader配合webpack-dev-server能在页面中弹出相应错误内容
3.eslint通过命令号对代码进行风格检查
2.修复相应风格问题
eslint --fix 命令能修复一部分代码风格问题;能修复的范围见https://cn.eslint.org/docs/rules/中带工具图标的部分
常见问题
如何在局部禁用eslint
/* eslint-disable no-alert, no-console */ alert('foo'); console.log('bar'); /* eslint-enable no-alert, no-console */
以下是详细配置
{ root: true,// 直接在根目录读取配置文件,能提高eslint性能 "env": { "node": true,// 允许使用nodejs相关的变量,下同 "es6": true, "browser": true, "commonjs": true }, "extends": "standard", // 继承eslint-config-standard中的配置,可以在rules中覆盖 "parser": "babel-eslint", // 为eslint制定parser,默认的Esprima只允许已纳入es标准的内容 "plugins": "vue",// 使用eslint-plugin-vue,使eslint能对vue语法进行处理,相应rules见https://eslint.vuejs.org/rules/ "rules": { "no-alert": 2, "indent": ["error", 4, { "SwitchCase": 1, "VariableDeclarator": 1, "outerIIFEBody": 1, "MemberExpression": 1, "FunctionDeclaration": { "parameters": 1, "body": 1 }, "FunctionExpression": { "parameters": 1, "body": 1 }, "CallExpression": { "arguments": 1 }, "ArrayExpression": 1, "ObjectExpression": 1, "ImportDeclaration": 1, "flatTernaryExpressions": false, "ignoreComments": false }] } }
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章推荐
- 【项目管理】代码风格规范
- js代码规范之Eslint安装与配置详解
- eslint使用姿势(优雅的代码规范)
- (开发)ESLint - 代码规范
- .Net 项目代码风格规范
- vue项目eslint环境配置与vscode配置eslint
- 软件工程基础课-个人项目-代码风格规范
- eslint 人性化配置
- 挖坑指南:ESLint + VS Code自动格式化代码
- PHP团队 编码规范 & 代码样式风格规范
- PHP PSR-2 代码风格规范 (中文版)
- c#项目代码风格要求
- PYTHON风格规范-Google 开源项目风格指南
- J2EE项目代码编写规范
- 基于.NET项目的代码书写规范要求书
- Object-C 声明属性为什么用下划线,代码规范和编程风格
- Net 项目代码风格
- ESLint可共享配置发布,团队自定义ESLint规则新鲜出炉
- [转]工程型软件项目的配置管理实例 (三) ——配置管理规范
- C#项目代码规范