安装一系列eslint插件后,填写eslint配置,配置如下

.editorconfig

root = true

[*]
charset = utf-8
indent_style = space
indent_size = 2
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true .eslintignore /build/
/config/
/dist/
/static/js
/src/test
**/*.js .eslintrc.js module.exports = {
root: true,
parserOptions: {
parser: 'babel-eslint'
},
env: {
browser: true,
},
globals: {
'AMap': true,
'$': true
},
extends: [
// https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
// consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
'plugin:vue/essential',
// https://github.com/standard/standard/blob/master/docs/RULES-en.md
'standard'
],
plugins: [
'html',
'vue'
],
rules: {
'generator-star-spacing': 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'semi': ['error', 'never'],
'no-extra-semi': "error",
'eqeqeq': 0,
'spaced-comment': 0,
'keyword-spacing': 0,
"quotes": [0, "single"],
'comma-dangle': 0,
'curly': 0,
'no-unused-expressions': 0,
'padded-blocks': ["error", "never"],
'space-before-function-paren': ["error", "always"],
'no-mixed-operators': 0,
'operator-linebreak': 0,
'camelcase': 0,
'no-lone-blocks': 0,
'no-new': 0,
'one-var': 0,
'no-unneeded-ternary': 0
}
} webpack.base.conf.js {
test: /\.(js|vue)$/,
loader: 'eslint-loader',
enforce: 'pre',
include: [resolve('src'), resolve('test')],
exclude: [resolve('src/components/upload')],
options: {
formatter: require('eslint-friendly-formatter'),
}
},
{
test: /\.vue$/,
loader: 'vue-loader',
options: vueLoaderConfig
}, User Settings {
"window.zoomLevel": 1,
"files.autoSave": "off",
"vetur.validation.template": false,
"search.followSymlinks": false,
"editor.tabSize": 2,
"editor.parameterHints": true,
"editor.quickSuggestions": {
"other": true,
"comments": true,
"strings": true
},
"workbench.colorTheme": "Solarized Dark", // 单引号
"prettier.singleQuote": true,
// 不加分号
"prettier.trailingComma": "all",
//去掉代码结尾的分号
"prettier.semi": false,
"vetur.format.defaultFormatter.js": "vscode-typescript",
// 使用 js-beautify-html 插件格式化 html
"vetur.format.defaultFormatter.html": "js-beautify-html",
//开启 eslint 支持
"prettier.eslintIntegration": true,
//每次保存自动格式化
"editor.formatOnSave": true,
// 每次保存的时候将代码按eslint格式进行修复
"eslint.autoFixOnSave": true,
// 添加 vue 支持
"eslint.validate": [
"javascript",
"javascriptreact",
{
"language": "html",
"autoFix": true
},
{
"language": "vue",
"autoFix": true
}
],
// 格式化插件的配置
"vetur.format.defaultFormatterOptions": {
"js-beautify-html": {
// 属性强制折行对齐
"wrap_attributes": "force-aligned",
}
},
//让函数(名)和后面的括号之间加个空格
"javascript.format.insertSpaceBeforeFunctionParenthesis": true,
//去掉分号
"stylusSupremacy.insertSemicolons": false,
//#去掉大括号
"stylusSupremacy.insertBraces": false,

eslint规范项目代码的更多相关文章

  1. ESLint 规范项目代码

    ESLint 由 JavaScript 红宝书 作者 Nicholas C. Zakas 编写, 2013 年发布第一个版本. NCZ 以可扩展.每条规则独立.不内置编码风格为理念编写了一个 lint ...

  2. Visual Studio Code 使用 ESLint 增强代码风格检查

    前言 在团队协作开发中,为了统一代码风格,避免一些低级错误,应该设有团队成员统一遵守的编码规范.很多语言都提供了Lint工具来实现这样的功能,JavaScript也有类似的工具:ESLint.除了可以 ...

  3. ESLint 检查代码质量

    利用 ESLint 检查代码质量 其实很早的时候就想尝试 ESLint 了,但是很多次都是玩了一下就觉得这东西巨复杂,一执行检查就是满屏的error,简直是不堪入目,遂放弃.直到某天终于下定决心深入看 ...

  4. Webpack 2 视频教程 010 - 配置 ESLint 实现代码规范自动测试 (下)

    原文发表于我的技术博客 这是我免费发布的高质量超清「Webpack 2 视频教程」. Webpack 作为目前前端开发必备的框架,Webpack 发布了 2.0 版本,此视频就是基于 2.0 的版本讲 ...

  5. Webpack 2 视频教程 009 - 配置 ESLint 实现代码规范自动测试 (上)

    原文发表于我的技术博客 这是我免费发布的高质量超清「Webpack 2 视频教程」. Webpack 作为目前前端开发必备的框架,Webpack 发布了 2.0 版本,此视频就是基于 2.0 的版本讲 ...

  6. 利用 ESLint 检查代码质量

    原文发表于作者的个人博客:http://morning.work/page/maintainable-nodejs/getting-started-with-eslint.html 其实很早的时候就想 ...

  7. 六、取消eslint 校验代码

    一.取消eslint 校验代码 删除 "eslintConfig": { "root": true, "env": { "node ...

  8. vscode如何安装eslint插件 代码自动修复

    ESlint:是用来统一JavaScript代码风格的工具,不包含css.html等. 方法和步骤: 通常情况下vue项目都会添加eslint组件,我们可以查看webpack的配置文件package. ...

  9. Vue2/3 项目中的 ESLint + Prettier 代码检测格式化风格指南

    Vue2/3 项目中的 ESLint + Prettier 代码检测格式化风格指南 因为平时都是使用 VSCode ESLint + Prettier 检测格式化不规范代码,但是随着接手的项目越来越多 ...

随机推荐

  1. IOS 创建一个可以随意拉伸不变形的图片

    创建一个扩展 UIImage的类 #import "UIImage_Extension.h" @implementation UIImage+Extension /** *返回一张 ...

  2. 最近面试前端岗位,汇总了一下前端面试题(JS+CSS)

    JavaScript 运行机制 1. 单线程(用途决定,需要与用户互动以及操作DOM) 2. 分同步任务(主线程)与异步任务(任务队列),只有任务队列通知主线程某个任务可以执行了,该 任务才会进入主线 ...

  3. web项目小总结

     初步小结 1.之前的CSS有些遗忘,返回去重新看知识点,频繁会浪费项目时间. 比如说: position定位 1 position: absolute;//绝对定位 2 position:relat ...

  4. 博学谷-数据分析pandas

    import pandas as pd df=pd.read_csv() df=pd.read_sql()

  5. git提交时报错 permission denied

    git push 时报错:permission denied xxx 目前很多解决办法是生成公钥和秘钥,这种方法安全可靠,比较适用于一台电脑对应一个git账户,但是多个账户在同一台电脑上提交使用git ...

  6. 07.VUE学习之解决phpstorm不识别ECMASCRIPT6语法的问题

    此时已经识别:

  7. JS如何判断是否为ie浏览器的方法(包括IE10、IE11在内)

    判断是否IE浏览器用的是window.navigator.userAgent,跟踪这个信息,发现在开发环境,识别为IE10,但访问服务器则识别为IE11,但IE11的userAgent里是没有MSIE ...

  8. Python基础:条件与循环

    条件语句 除了 boolean 类型的数据,条件判断最好是显性的 if i != 0: ... 而不是只写出变量名: if i: ... For循环与While循环 通常来说,如果你只是遍历一个已知的 ...

  9. B1066 图像过滤 (15分)

    B1066 图像过滤 (15分) 图像过滤是把图像中不重要的像素都染成背景色,使得重要部分被凸显出来.现给定一幅黑白图像,要求你将灰度值位于某指定区间内的所有像素颜色都用一种指定的颜色替换. 输入格式 ...

  10. MySQL查询数据库中表名或字段名

    查询数据库中所有表名 select table_name from information_schema.tables where table_schema='csdb' and table_type ...