vue eslint 规范配置
vue eslint 规范配置
为了代码格式统一,避免一些低级或者不合理的错误,现强行使用eslint
的 standard
规范
项目配置
目前都是使用 vue 提供的脚手架进行开发的,虽然 vue-cli 3.0
,但是公司因为配置了OAuth的缘故,暂时还是只能使用vue-cli 2.0
,
因而当前配置会结合两个版本进行阐述
目的
可以通过编辑器(vscode)进行提示同时可以修复,如此便是最好的
vue-cli 2.0
新建项目时选择
standard
格式
测试eslint (随便选个地方,打几个空格)
保存时可以自动修复 (或者代码格式化时修复)
由于
vetur
使用的格式化是prettier
的方式,并不是我们想要的standard
,目前两种操作方式
- 方案1: 若是能将
prettier
改为我们想要的,这是最好的 - 方案2: 不改变
prettier
,而是在保存时再按照standard
的形式保存也不赖的
针对上面描述,当前才用的是第二种方案(第一种方式还没找到解决办法)
采用
方案2
,操作流程安装插件
ESLint
vscode
setting.json
添加配置// 开启
"eslint.enable": true,
// 保存
"eslint.autoFixOnSave": true,
"eslint.run": "onType",
"eslint.options": {
"extensions": [".js",".vue"]
},
"eslint.validate": [
// 此处保存时,自动修复
{ "language": "vue", "autoFix": true },
"javascript",
"html",
"vue-html"
]
效果
- 方案1: 若是能将
vue-cli 3.0
操作相同(细微区别先不描述)
eslint简单描述
eslint目前有两个大的分支
airbnb 比 standard 规则要求更加严格,这也是为何选择 standard的缘故,由于规则并不是百分百符合每个公司,因而都会在此基础上,进行私人定制 eslint-config-vue 具体规则描述见 eslint官网
关闭某个特定eslint校验 网友
总结
- 若是能在代码格式化时就可以进行修复,这才是最好的
- 如何定制自己的规则,这个有些难(众口难调)
- 后续再进行补充吧(点之间还是有些散)
vue eslint 规范配置的更多相关文章
- vscode自动修复eslint规范的插件及配置
在开发大型项目中,经常都是需要多人合作的.相信大家一定都非常头疼于修改别人的代码的吧,而合理的使用eslint规范可以让我们在代码review时变得轻松,也可以让我们在修改小伙伴们的代码的时候会更加清 ...
- VSCode中使用vue项目ESlint验证配置
如果在一个大型项目中会有多个人一起去开发,为了使每个人写的代码格式都保持一致,就需要借助软件去帮我们保存文件的时候,自己格式化代码 解决办法:vscode软件下载一个ESLint,在到设置里面找到se ...
- vue项目eslint环境配置与vscode配置eslint
eslint基础环境搭建 全局安装eslint:npm install eslint -g 项目eslint初始化:eslint --init,按团队或自己的编程风格回答三道题. ? How woul ...
- Vue+ESLint+Git钩子函数pre-commit配置教程
一.创建Vue项目eslint-standard vue create eslint-standard 二.创建.eslintrc.* 删除package.json中的eslintConfig配置 我 ...
- 如何为你的 Vue 项目添加配置 Stylelint
如何为你的 Vue 项目添加配置 Stylelint 现在已经是 9102 年了,网上许多教程和分享帖都已经过期,照着他们的步骤来会踩一些坑,如 stylelint-processor-html 已经 ...
- eslint详细配置
vue-cli3按照官网教程配置搭建后,发现每次编译,eslint都抛出错误, 修改配置在 .eslintrc.js中修改 或者 关闭eslint 1.关闭eslint 直接注释掉package ...
- vscode保存代码,自动按照eslint规范格式化代码设置
# vscode保存代码,自动按照eslint规范格式化代码设置 编辑器代码风格一致,是前端代码规范的一部分.同一个项目,或者同一个小组,保持代码风格一致很必要.就拿vue项目来说,之前做的几个项目, ...
- vscode设置VUE eslint开发环境
我的使用vscode开发VUE的常用设置 1.安装插件 ESLint Vetur Beautify Prettier - Code formatter Auto Rename Tag -重命名标签,闭 ...
- vue cli3 项目配置
[转]https://juejin.im/post/5c63afd56fb9a049b41cf5f4 基于vue-cli3.0快速构建vue项目 本章详细介绍使用vue-cli3.0来搭建项目. 本章 ...
随机推荐
- linux-ssh加密与https安全-9
非对称加密算法:RSA,DSA/DSS 对称加密算法:AES,RC4,3DES HASH算法:MD5,SHA1,SHA256 hash就是找到一种数据内容和数据存放地址之间的映射关系 (1) 文件校验 ...
- 通过 PHP 生成 XML
如需使用 PHP 在服务器上生成 XML 响应,请使用下面的代码: <?php header("Content-type:text/xml"); echo "< ...
- sh_02_第一个while循环
sh_02_第一个while循环 # 打印 5 遍 Hello Python # 1. 定义一个整数变量,记录循环次数 i = 1 # 2. 开始循环 while i <= 3: # 1> ...
- 【Leetcode】整数反转
题解参考:https://leetcode-cn.com/problems/reverse-integer/solution/zheng-shu-fan-zhuan-by-leetcode/ 复杂度分 ...
- 5.Python注释(多行注释和单行注释)用法详解
Python单行注释 Python 中使用井号(‘#’)作为单行注释的符号,语法格式为: # 注释内容 也就是说,从符号‘#’处开始,直到换行处结束,此部分内容都作为注释的内容,当程序执行时,这部分内 ...
- eclipse 简单配置
1.安装STS4 help-->Eclipse Maketplace-->search 'STS'-->install 2.代码提示 Window-->preferences- ...
- MYSQL与Navicat的连接错误问题
唱,跳,RAP,Basketball MySQL版本安装 遇到的一个坑(密码加密规则被修改导致Navicat连接不上) 众所周知,老师的一些任务,往往做起来不是很困难,只要按着步骤就可以,但是在程序的 ...
- 2018-2019-2 20165235《网络对抗技术》Exp7 网络欺诈防范
2018-2019-2 20165235<网络对抗技术>Exp7 网络欺诈防范 实验目的 本实践的目标理解常用网络欺诈背后的原理,以提高防范意识,并提出具体防范方法 实验内容 (1)简单应 ...
- zabbix监控惠普打印机
http://www.ttlsa.com/zabbix/zabbix-monitor-hp-printer/
- 多网卡情况下接收udp组播
多网卡下接收udp组播 往往会接收失败 因为用错了网卡 例如我想要接收2网段 其他电脑出的udp组播 我电脑有有线网和wifi在window下可以这样 route add 230.0.0.1 mas ...