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 检测格式化不规范代码,但是随着接手的项目越来越多 ...
随机推荐
- 1.VS Code 开发C#入门 安装Dotnet core
1. dot.net 网站 下载 .NET Core 1.0 (https://www.microsoft.com/net/download/core) 2. 打开命名提示符: 3.dotnet ...
- 安装Ubuntu桌面环境后只能Guest登录的解决办法
1.安装Ubuntu桌面环境后,登录界面只显示了Guest 2.在登录界面按住crtl+shift+F1,进入tty模式 3.输入sudo -s进入root模式 4.输入vi /etc/lightdm ...
- 02-CSS基础与进阶-day13_2018-09-21-20-05-21
css3动画 @keyframes 动画名 { 0% { } 100% { } } 元素执行动画 animation: 动画名 运动时间 运动曲线 01运动的汽车.html <!DOCTYPE ...
- CUDA 中dim3含义
- Java构造方法经典例题
1.在程序中,经常要对时间进行操作,但是并没有时间类型的数据.那么,我们可以自己实现一个时间类,来满足程序中的需要. 定义名为MyTime的类,其中应有三个整型成员:时(hour),分(minute) ...
- 洛谷 P1346 电车
这道题的关键在建图 把每一个车站看成一个点,将这个车站相连的第一个车站建立一条边权为0的边,对于它所相连的其他车站,建立边权为1的边: 这样我们可以得到一张图: 起点,终点都知道了,跑一边最短路即可 ...
- ElasticSearch部署问题
以下几个是以前在自己部署ElaticSearch的时候收集到的,认为有用的 https://my.oschina.net/topeagle/blog/591451?fromerr=mzOr2qzZ h ...
- php 多维数组指定某个值作为键
$temp_key = array_column($mobile_arr,'cidf'); //键值 $mobile_arr = array_combine($temp_key,$mobile_arr ...
- windows Server 2008 r2-搭建FTP服务器
FTP协议介绍 FTP协议工作在OSI参考模型的第七层,TCP模型的第四层上(即应用层上).使用FTP传输而不是UDP,与服务端建立连接经过三次握手. FTP端口介绍 FTP默认端口是21,.(21端 ...
- stark组件前戏(3)之django路由分发的本质include
django路由分发的三种方式 方式一: from django.urls import re_path, include urlpatterns = [ re_path(r'^web/', incl ...