前言

使用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. 【错误】python百分号冲突not enough arguments for format string

    query = "SELECT * FROM devices WHERE devices.`id` LIKE '%{}%'".format("f2333") d ...

  2. Django文档阅读-Day2

    Django文档阅读 - Day2 Writing your first Django app, part 1 You can tell Django is installed and which v ...

  3. python爬取优美图库海量图片,附加代码,一键爬取

    优美高清图片为大家提供高清美女套图赏析,非高清不录入,大家的网速要给力. 今天教大家爬取优美图库网站中高质量的图片!! 简单易上手哦~ 使用工具: Python 3.6 pycharm 相关环境: r ...

  4. python os模块判断文件是否存在

    import os os.path.exists(test_file.txt)

  5. 一张图记住Linux系统常用诊断工具

  6. 一篇文章掌握网页解析神器——xpath

    学爬虫不会xpath解析数据? 今天老师带你一堂课带你从零开始精通xpath,从此轻松提取网页信息. 我们在爬虫的过程中,经常会遇到html字符串数据,很多我们需要的数据不是作为标签的文本就是作标签的 ...

  7. 只会Vue怎么开发小程序?vue和微信小程序的到底有哪些区别?

    写了vue项目和小程序,发现二者有许多相同之处,在此想总结一下二者的共同点和区别. 一.生命周期 先贴两张生命周期图对比下: vue生命周期 小程序生命周期 相比之下,小程序的钩子函数要简单得多. v ...

  8. linux抓包的实现

    工具: wireshark tcpdump 在这里仅仅介绍后者: 在网络问题的调试中,tcpdump应该说是一个必不可少的工具,和大部分linux下优秀工具一样,它的特点就是简单而强大. 默认情况下, ...

  9. Ubuntu parted 命令 写在脚本里时要带 -s 参数

    否则会要求用户输入,造成脚本卡住.

  10. (c++ std) 查找 vector 中的元素

    You can use std::find from <algorithm>: std::find(vector.begin(), vector.end(), item) != vecto ...