vscode 代码保存时自动格式化成 ESLint 风格
vscode 的默认的代码格式化 alt+shift+f (windows) 无法通过 eslint 的代码风格检查,,,
比如:
- 4个空格和2个空格(ESLint)
- 字符串用单引号(ESLint)
这样在进行vue项目开发的时候,使用 eslint 代码风格检查就会报错:
所以需要在保存的时候,使 vscode 代码自动格式化成 eslint 风格的代码,并且支持在 html 和 vue 中的代码;
首先装下 ESlint 插件
然后配置项:文件 -> 首选项 -> 设置,加上下面设置:
"eslint.autoFixOnSave": true,
"eslint.validate": [
"javascript",
"javascriptreact",
{
"language": "html",
"autoFix": true
},
{
"language": "vue",
"autoFix": true
}
]
eslint.autoFixOnSave 用来进行保存时自动格式化,但是默认只支持 javascript .js 文件
eslint.validate 用来配置作用的文件类型。
- eslint插件的配置说明中,直接写的是
"eslint.validate": [ "javascript", "javascriptreact", "html" ],因此我想当然一开始写的是"eslint.validate": [ "javascript", "javascriptreact", "html", "vue" ],结果是不起作用的,必须要写成上面那样; autoFixOnSave对于 .vue 文件,自动保存时(我是失焦保存)不会autoFix ,必须要手动保存 ctrl+s 才会autoFix;对于 .js 文件,我失焦保存后,会 autoFix;不过对于一些无法 autoFix 的,是不会 autoFix 的(譬如:多余的分号会去掉,4个空格变2个,但是语法错误还是会放那边);
参考文档:
http://www.ptbird.cn/vscode-autosave-eslint-support-vue.html
vscode 代码保存时自动格式化成 ESLint 风格的更多相关文章
- vscode代码保存时自动格式化成ESLint风格(支持VUE)
一.问题 vscode的默认的代码格式化ctrl+shift+f 无法通过eslint的代码风格检查是一个非常蛋疼的问题 同样在进行vue项目开发的时候,使用eslint代码风格检查是没啥问题的,但是 ...
- VScode 格式化代码保存时使用ESlint修复代码
前言 eslint vs code 新买的电脑啊啊西 装VScode 配置格式化代码保存时使用ESlint修复代码头快炸了,不建议初学者用,太费时间了: 终于搞定---再也不要担心缩进,函数(名)和 ...
- vscode代码格式化快捷键及保存时自动格式化
一.实现vs code中代码格式化快捷键:[Shift]+[Alt]+ F 二.实现保存时自动代码格式化: 1)文件 ------.>[首选项]---------->[设置]: 2)搜索 ...
- 设置Myeclipse中的代码格式化、注释模板及保存时自动格式化
1:设置注释的模板: 下载此模板: codetemplates.xml 搜索Dangzhang,将其改为你自己的姓名,保存 打开eclipse/myeclipse选择 window-->Pre ...
- Myeclipse学习总结(3)——Myeclipse中的代码格式化、注释模板及保存时自动格式化
设置Myeclipse中的代码格式化.注释模板及保存时自动格式化 1:设置注释的模板: 下载此模板: codetemplates.xml This XML file does not appear ...
- Intellij IDEA 代码格式化/保存时自动格式化
这里介绍使用google style 一.安装插件 1.settings -> plugins 选择 Browse repositories… 2.搜索google-java-format 和 ...
- 关于visocode 自动保存时自动添加分号问题
先下载插件: Vueter 打开设置的配置文件,写入一下代码: // //是否需要保存时自动格式化 "editor.formatOnSave": true, //使js 文件保存 ...
- vscode 使用ESLint 自动检查,保存时自动格式化
1:全局安装eslint `npm install -g eslint`2: 打开vscode 点击 “文件”----->“首选项”---->“设置”,在右侧“用户设置/settings. ...
- Eclipse设置保存时自动格式化代码
在使用eclipse时,经常需要使用到Ctrl+Shift+F来格式化代码,可以打开保存时格式化,会更方便. 打开方式:Window-->Preferences-->Java --> ...
随机推荐
- imx6 android4.2 编译
编译imx6dl android4.2的镜像,记录编译的命令. Build Android Image # Build Android images for i.MX6 SABRE-SD boards ...
- snmp trap编写
1.MIB库查看net-snmp的安装目录./usr/share/snmp/mibs目录下: NET-SNMP-EXAMPLES-MIB.mib本件部分内容如下: netSnmpExampleHear ...
- activiti小结
前提:业务流程复杂且流程频繁变更的,建议使用工作流:其他情况不建议使用. activiti(v5.14),工作流引擎,基于jbpm.使用建模语言BPMN2.0进行定义. 工作流数据需要写入数据库,ac ...
- WinInet 小例子
#include <windows.h> #include <wininet.h> #include <string> #include <iostream& ...
- Supervision 行为模式
官方链接:http://erlang.org/doc/man/supervisor.html http://erlang.org/doc/design_principles/sup_princ.htm ...
- PHP中如何获取网站根目录物理路径
在php程序开发中经常需要获取当前网站的目录,我们可以通过常量定义获取站点根目录物理路径,方便在程序中使用. 下面介绍几种常用的获取网站根目录的方法. php获取网站根目录方法一: <?php ...
- Oracle从字符串资源中得到想要的数据分析
[oracle]从字符串资源中得到想要的数据分析需求:订单分析,按照游戏,帐号级别,游戏帐号职业,区服,价格区间分析各款交易数据走势 .目标:订单表(order)处理分析:订单中可以直接读到的标示有游 ...
- ChemOffice Professional 16.0新增了哪些功能
ChemOffice Professional 16.0是为终极化学和生物组件设计,可满足化学家和生物学家的需求.ChemOffice Professional帮助科学家有效地检索数据库,包括SciF ...
- QQ第三方登录实例demo(QQSDK包优化)
实现效果: 实现流程: 1.注冊QQ互联开发人员 QQ互联官网 注冊成为开发人员(须要审核) 2.审核通过之后 申请应用(须要互联人员审核*须要备案成功的线上域名) 以下我们開始下载QQsdk包 QQ ...
- POJ 1426 Find The Multiple(背包方案统计)
Description Given a positive integer n, write a program to find out a nonzero multiple m of n whose ...