eslint规范项目代码
安装一系列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规范项目代码的更多相关文章
- ESLint 规范项目代码
ESLint 由 JavaScript 红宝书 作者 Nicholas C. Zakas 编写, 2013 年发布第一个版本. NCZ 以可扩展.每条规则独立.不内置编码风格为理念编写了一个 lint ...
- Visual Studio Code 使用 ESLint 增强代码风格检查
前言 在团队协作开发中,为了统一代码风格,避免一些低级错误,应该设有团队成员统一遵守的编码规范.很多语言都提供了Lint工具来实现这样的功能,JavaScript也有类似的工具:ESLint.除了可以 ...
- ESLint 检查代码质量
利用 ESLint 检查代码质量 其实很早的时候就想尝试 ESLint 了,但是很多次都是玩了一下就觉得这东西巨复杂,一执行检查就是满屏的error,简直是不堪入目,遂放弃.直到某天终于下定决心深入看 ...
- Webpack 2 视频教程 010 - 配置 ESLint 实现代码规范自动测试 (下)
原文发表于我的技术博客 这是我免费发布的高质量超清「Webpack 2 视频教程」. Webpack 作为目前前端开发必备的框架,Webpack 发布了 2.0 版本,此视频就是基于 2.0 的版本讲 ...
- Webpack 2 视频教程 009 - 配置 ESLint 实现代码规范自动测试 (上)
原文发表于我的技术博客 这是我免费发布的高质量超清「Webpack 2 视频教程」. Webpack 作为目前前端开发必备的框架,Webpack 发布了 2.0 版本,此视频就是基于 2.0 的版本讲 ...
- 利用 ESLint 检查代码质量
原文发表于作者的个人博客:http://morning.work/page/maintainable-nodejs/getting-started-with-eslint.html 其实很早的时候就想 ...
- 六、取消eslint 校验代码
一.取消eslint 校验代码 删除 "eslintConfig": { "root": true, "env": { "node ...
- vscode如何安装eslint插件 代码自动修复
ESlint:是用来统一JavaScript代码风格的工具,不包含css.html等. 方法和步骤: 通常情况下vue项目都会添加eslint组件,我们可以查看webpack的配置文件package. ...
- Vue2/3 项目中的 ESLint + Prettier 代码检测格式化风格指南
Vue2/3 项目中的 ESLint + Prettier 代码检测格式化风格指南 因为平时都是使用 VSCode ESLint + Prettier 检测格式化不规范代码,但是随着接手的项目越来越多 ...
随机推荐
- CYUSB
/*Summary The application cydesc is used to open the device with cypress GUID and get the device des ...
- kubernetes-控制器Deployment和DaemonSet(八)
Pod与controllers的关系 •controllers:在集群上管理和运行容器的对象•通过label-selector相关联•Pod通过控制器实现应用的运维,如伸缩,升级等 控制器又称工作负载 ...
- SpringBoot学习1:创建第一个SpringBoot项目
一.新建项目 二.打开项目的pom文件,在里面添加maven依赖 <!--springboot项目依赖的父项目--> <parent> <groupId>org.s ...
- 解决使用Application Loader上传ipa提示“上传appstore失败”
试了好多次使用Application Loader上传ipa,一直提示上传失败,用其他mac电脑却可以,那就是环境有问题,笔者试过重装xcode,都无法解决问题, 查看日志类似是jdk版本问题,换了所 ...
- git与github账号建立SSH连接
第1步:创建SSH Key.在用户主目录下,(就是在你的工作空间一层)看看有没有.ssh目录,如果有,再看看这个目录下有没有id_rsa和id_rsa.pub这两个文件,如果已经有了,可直接跳到下一步 ...
- 《转载》ASP动态iframe
原文:[ASP.NET]关于iframe的两个技巧 最近在给朋友写个网站,虽然不大,但是也碰到了一些问题.这篇就为解决ASP.NET中关于IFRAME的两个很现实的问题提供解决方法.PS:呵呵,又做了 ...
- css分层,实现遮罩底层弹出新窗口里可以操作,最下层能看到单不能操作
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ATMstart
import os, sys BASE_DIR = os.path.dirname(__file__)sys.path.append(BASE_DIR) from core import src if ...
- 【PHP】php中json_decode()和json_encode()
1.json_decode() json_decode (PHP 5 >= 5.2.0, PECL json >= 1.2.0) json_decode — 对 JSON 格式的字符串进行 ...
- Paul Zindel【保罗·金代尔】
Paul Zindel Paul Zindel's death on March 27, 2003 ended the brilliant life of a famous write. 2003年3 ...