工作中遇到的vscode配合eslint完成保存为eslint格式
vscode个人设置
// vscode的个人设置配置
{
"workbench.iconTheme": "vscode-icons",
"workbench.colorTheme": "Dracula Italics",
"vetur.format.defaultFormatter.js": "prettier",
"javascript.format.insertSpaceBeforeFunctionParenthesis": true,
"editor.quickSuggestions": {
"strings": true
},
"eslint.autoFixOnSave": true,
// "eslint.nodePath": "D:/develop/nvm/nodejs",
"editor.formatOnSave": true,
"editor.tabSize": 2,
"eslint.options": {
"plugins": [
"html"
],
"configFile": "项目目录下.eslintrc.js绝对路径"
},
"eslint.validate": [
"javascript",
"javascriptreact",
"html",
"vue",
{
"language": "vue",
"autoFix": true
},
{
"language": "html",
"autoFix": true
}
],
"prettier.disableLanguages": [
"vue",
"js"
],
"prettier.singleQuote": true,
"prettier.semi": false,
"prettier.stylelintIntegration": true,
}
// eslintrc.js配置
module.exports = {
root: true,
// EsLint默认使用esprima做脚本解析,也可以切换他,比如切换成babel-eslint解析
parser: 'babel-eslint',
parserOptions: {
//指定来源的类型,有两种”script”或”module”
sourceType: 'module'
},
// Environment可以预设好的其他环境的全局变量,如brower、node环境变量、es6环境变量、mocha环境变量等
env: {
browser: true
},
// Extends是EsLint默认推荐的验证,你可以使用配置选择哪些校验是你所需要的,可以登录npmjs.com查看
extends: 'standard',
// required to lint *.vue files
plugins: ['vue', 'html'],
// add your custom rules here
rules: {
// allow async-await
'generator-star-spacing': 'off',
// 箭头函数的参数使用圆括号,0是关闭规则"off",1是警告"warn",2是报错"error"
'arrow-parens': 0,
// 强制 generator 函数中 * 号周围使用一致的空格
'generator-star-spacing': 0,
// 函数周围空格的设置
'space-before-function-paren': [
'error',
{
anonymous: 'never',
named: 'never',
asyncArrow: 'always'
}
],
// allow debugger during development
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
// 要求使用error对象作为promise拒绝的原因
'prefer-promise-reject-errors': 'off',
'padded-blocks': 0
}
}
vscode插件安装
- beautify 美化代码 好像没用到 安全起见先加上
- Bracket Pair Colorizer 美化括号 让你的括号看起来更好看
- Dracula theme 一个主题 随便装不装
- Dracula Theme with Italic keywords 刚才那个主题的配套设施,内容看起来是斜体,有点意思
- EditorConfig for Visual Studio Code 代码风格配置插件
- eslint 不多说 就装吧
- JavaScript standard style standard标准编码风格
- Path Intellisense 自动完善路径
- prettier 代码格式化
- veture vue大礼包
- vscode-icons 美化图标
需要的项目环境
- npm install eslint eslint-plugin-html babel-eslint eslint-plugin-vue eslint-config-standard eslint-friendly-formatter --save-dev
- npm install eslint-loader eslint-plugin-import eslint-plugin-node eslint-plugin-promise --save-dev
- 可以全局装 也可以项目装,不要全局安装和本地安装混合,那样在执行命令的时候全局容易找不到本地的配置,本地找不到全局的包
- node_modules/.bin/eslint --fix path/to/要eslint的文件 可以对文件进行eslint规则修复
参考文档
工作中遇到的vscode配合eslint完成保存为eslint格式的更多相关文章
- 工作中遇到的问题--Hibernate一对多保存简化Service层代码
在创建一方的entity是添加一个增加多方的方法: package com.sim.mfg.data.domain; import java.io.Serializable;import java.u ...
- Matlab中使用Java api画图图形并保存为jpeg格式
直接上代码: close all; import java.io.*; import java.awt.*; import java.awt.image.BufferedImage; import j ...
- git 工作中常用命令(结合vscode学习git 命令)
作为一名前端开发,大家在工作中常常使用什么开发工具呢,我觉得我首选的是vscode,他配合git使用起来非常方便. 工作中常用三个命令: git终端常使用: git add . git commit ...
- VSCode配合ESLint自动修复格式化
开发Vue或者React的项目的时候,我们经常用到ESLint进行代码的校验,当代码出现不符合规范的格式的时候,ESLint会在控制台提示相关的异常信息. ESLint极大的提高了团队代码的一致性和规 ...
- 运维工作中sed常规操作命令梳理
sed是一个流编辑器(stream editor),一个非交互式的行编辑器.它一次处理一行内容.处理时,把当前处理的行存储在临时缓冲区中,称为"模式空间",接着用sed命令处理缓冲 ...
- 工作中常用Git指令操作
常用Git指令总结 前阵子有几天好不顺,可谓是喝水都呛着,更何况被Git给呛着了,还不轻,哈哈.所以打算总结一下自己在工作使用到Git相关的东西以及和大家探讨使用GIt的心得体会.于是,关于Git的的 ...
- 转摘Linux命令工作中常用总结
Linux命令工作中常用总结 1. 搜索 在vi和vim中如果打开一个很大的文件,不容易找到对应的内容,可以使用自带的搜索关键字进行搜索定位: 在vi和vim界面中输入:"/" ...
- Linux 运维工作中的经典应用ansible(批量管理)Docker容器技术(环境的快速搭建)
一 Ansible自动化运维工具 Python 在运维工作中的经典应用 ansible(批量管理操作) .安装ansible(需要bese epel 2种源) wget -O /etc/yum.rep ...
- Linux命令工作中常用总结
1. 搜索 在vi和vim中如果打开一个很大的文件,不容易找到对应的内容,可以使用自带的搜索关键字进行搜索定位: 在vi和vim界面中输入:"/"(反斜杠),之后会出现一个输入框让 ...
随机推荐
- ios swift4之kvo的使用
在swift4之前,使用kvo只需要继承NSObject 就可以了.但是swift4之后发生了变化,必须在class之前加入@objcMembers修饰,不然就没有效果了. 下面举个例子:如定义一个P ...
- Windows服务注意!
安装不成功 报错,或者安装成功 不运行 ,要把引用的dll文件 放到obj \debug文件夹下
- Qt 学习之路 2(12):菜单栏、工具栏和状态栏
Home / Qt 学习之路 2 / Qt 学习之路 2(12):菜单栏.工具栏和状态栏 Qt 学习之路 2(12):菜单栏.工具栏和状态栏 豆子 2012年9月10日 Qt 学习之路 2 2 ...
- 解决spring使用动态代理
解决spring使用动态代理类型转换失败的问题--java.lang.ClassCastException: com.sun.proxy.$Proxy$ cannot be cast to ... 转 ...
- Vscode 隐藏 工作区中的目录
{ "files.exclude": { "**/.git": true, "**/.svn": true, "**/.hg&qu ...
- Java的JsonHelper
<!-- https://mvnrepository.com/artifact/com.google.code.gson/gson --> <dependency> <g ...
- django 自带的验证功能
django.contrib.auth提供了很多验证方法 authenticate(): 提供了用户认证,在自带的数据库表中验证用户名和密码,需要username和password两个关键字参数 如果 ...
- windows查看网络常用cmd命令
一.ping 主要是测试本机TCP/IP协议配置正确性与当前网络现状. ping命令的基本使用格式是: ping IP地址/主机名/域名 [-t] [-a] [-n count] [-l size] ...
- pip 安装库的时候使用豆瓣镜像 提升效率
由于众所周知的原因,国内网络环境始终处于水深火热之中,python库的安装也不例外. 比如在安装 PyQt5-tools 的时候,网速奇慢无比. 好在国内有不少镜像服务源,以豆瓣为例,网速突飞猛进 使 ...
- Ubuntu14.04配置python接口,测试的小问题
当遇到“ImportError:No module named google.protobuf.internal”(import enum_type_wrapper)的问题时候 solution: P ...