前言

使用vscode开发vue项目的时候,为了编码格式的统一化,使用eslint规范进行格式化。此时通过eslint插件可以实现对vue代码的自动格式化。

使用方式

在vscode的插件模块处,搜索eslint。找到下面的插件。



安装完成后,进行配置。

file --> preferences --> setting

找到eslint。



打开setting.json。

在里面配置如下代码:

{
"eslint.options": {
"extensions": [
".js",
".vue"
]
},
"eslint.validate": [
"javascript",
{
"language": "vue",
"autoFix": true
},
"html",
"vue"
],
"eslint.autoFixOnSave": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"eslint.codeAction.disableRuleComment": {},
"eslint.alwaysShowStatus": true,
}

重启后,修改代码,当不符合es规范的时候,使用ctrl+s保存的时候,就自动修复了。

vscode+eslint自动格式化vue代码的方法的更多相关文章

  1. vs code 设置 保存自动格式化vue代码

    配置 ESLint (需安装 Prettier - Code formatter 插件) command + shift + p  打开用户设置 // vscode默认启用了根据文件类型自动设置tab ...

  2. 在vscode中使用eslint+prettier格式化vue项目代码 (转载)

    ESlint:javascript代码检测工具,可以配置每次保存时格式化js,但每次保存只格式化一点点,你得连续按住Ctrl+S好几次,才格式化好,自行体会~~ vetur:可以格式化html.标准c ...

  3. vscode 保存自动 格式化eslint 代码

    在网上找了很多种方法,大多都没有成功  一下是一种成功的 配置方法: 1) First, you need to install the ESLint extension in the VS code ...

  4. PyCharm配置autopep8,自动格式化Python代码

    1. 关于PEP 8 PEP 8,Style Guide for Python Code,是Python官方推出编码约定,主要是为了保证 Python 编码的风格一致,提高代码的可读性. 官网地址:h ...

  5. vscode在vue-cli中按照ESlint自动格式化代码

    先安装 1 npm i -S eslint-plugin-vue .eslintrc下 1 2 3 "plugins": [     "vue" ] vscod ...

  6. vscode 格式化vue代码单引号变双引号

    首选项->设置.输入框输入vetur vscode中设置 "vetur.format.defaultFormatterOptions": { "prettier&q ...

  7. 配置 ESLint 自动格式化自闭合标签(Self closing tag)

    对于没有子元素或不需要子元素的 HTML 标签,通常写成其自闭合的形式会显得简洁些, - <SomeComponent></SomeComponent> + <SomeC ...

  8. WebGIS中以version方式实现代码更新后前端自动读取更新代码的方法

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1. 前言 GIS代码进行更新后,由于用户前端已有缓存,导致更新的功能不 ...

  9. vscode编辑器自动生成.vue文件

    1.选择“文件 -> 首选项 -> 用户代码片段”,此时,会弹出一个搜索框,输入vue 选择vue后,编辑器会自动打开一个名字为vue.json的文件 2.复制以下内容到这个文件中: { ...

随机推荐

  1. JS:document.documentElement对象的

    document.documentElement.clientWidth 获取浏览器窗口文档显示区域的宽度,不包括滚动条. document.documentElement.clientHeight ...

  2. 手机app测试用例怎么写?手机app测试点有哪些?只有干货没有水分,错过绝对后悔!

    一.前言    在当今竞争激烈的市场上一个APP的成功离不开一个可靠的测试工程师.因此,对功能和用户体验有特殊关注的App进行全面测试是必不可少的.如何做到测试用例的百分百覆盖一直是测试用例编写过程中 ...

  3. Java 网络编程 -- 基于TCP实现文件上传

    Java TCP 操作基本流程 一.创建服务器 1.指定端口, 使用serverSocket创建服务器 2.阻塞式连接 accept 3.操作:输入流 输出流 4.释放资源 二.创建客户端 1.使用S ...

  4. LDA概率主题模型

    目录 LDA 主题模型 几个重要分布 模型 Unigram model Mixture of unigrams model PLSA模型 LDA 怎么确定LDA的topic个数? 如何用主题模型解决推 ...

  5. CountDownLatch/CyclicBarrier/Semaphore

    CountDownLatch 概念 让一些线程阻塞直到另一些线程完成一系列操作才被唤醒 CountDownLatch主要有两个方法,当一个或多个线程调用await方法时,调用线程就会被阻塞.其它线程调 ...

  6. swoole学习--图文直播和聊天室

    其实这个也没有什么好值得记录的,但是前面都记下来了,我也顺便说说吧: 1.为了方便,最好把http服务声明为超全局变量. 2.在一些地方里面,你声明的http超全局变量是用不了的,你只能用他自己内置的 ...

  7. CG-CTF(2)

    CG-CTF https://cgctf.nuptsast.com/challenges#Web 续上~ 第七题:单身二十年 查看源代码: 取得flag(干杯~): 本题也可通过burp抓包,查看返回 ...

  8. Spring5参考指南:基于注解的容器配置

    文章目录 @Required @Autowired @primary @Qualifier 泛型 @Resource @PostConstruct和@PreDestroy Spring的容器配置可以有 ...

  9. docker 部署FastDFS

    教程:https://blog.csdn.net/fangchao2011/article/details/103202591 教程:https://www.jianshu.com/p/3f80cba ...

  10. 单源最短路问题--朴素Dijkstra & 堆优化Dijkstra

    许久没有写博客,更新一下~ Dijkstra两种典型写法 1. 朴素Dijkstra     时间复杂度O(N^2)       适用:稠密图(点较少,分布密集) #include <cstdi ...