背景

继承了组里师兄师姐写的项目的前端代码,但是是两个人写的,有两格缩进的,有四格缩进的,有字符串外用单引号的,有用双引号的。

于是搜索了一下,可以用eslint强制转化。

eslint在github上的链接:https://github.com/eslint/eslint

安装

  1. 用VS Code打开刚下载好的项目,npm init项目初始化后(一般不需要这个步骤,这是为了加载各种npm包)
    在终端 npm install eslint --save-dev
    结果:


    不建议用 npm install eslint -g全局安装,因为往下会发现eslint的配置有很多选择,不同项目使用的配置可能不一样。

  2. ./node_modules/.bin/eslint --init 在这个项目上初始化eslint,然后会有一个初始化向导。

    上面的问题三种选择: 
    如果选择 Use a popular style guide 有:

    如果选择 Answer questions about your style:

    完成初始化向导后:
    The config that you've selected requires the following dependencies:

    eslint-plugin-vue@latest
    Successfully created .eslintrc.js file in

  3. 根据提示在终端中  npm install eslint-plugin-vue@latest

  4. 在终端敲命令 
    ./node_modules/.bin/eslint yourfile.js/yourdir --fix

  5. 在项目文件夹下的.eslintrc.js文件中 ,修改rules
    1. 'rules': {
    2. 'indent': [
    3. 'warn',
    4. 'tab'
    5. //强制统一缩进
    6. ],
    7. 'linebreak-style': [
    8. 'error',
    9. 'windows'
    10. //Windows的行结尾方式
    11. ],
    12. 'quotes': [
    13. 'warn',
    14. 'single'
    15. //单引号
    16. ],
    17. 'semi': [
    18. 'warn',
    19. 'never'
    20. //不加分号
    21. ]
    22. }
  6. 更多的自定义配置项可以看:
    https://www.cnblogs.com/yangshifu/p/9585462.html

遇到的问题

1. ESLint is disabled since its execution has not been approved or denied yet. Use the light bulb menu to open the approval dialog.


点击右下角的ESLint,选择Allow Everywhere即可。

答案来自

使用eslint将项目中的代码修改统一的缩进的更多相关文章

  1. Roslyn 入门:使用 Roslyn 静态分析现有项目中的代码

    Roslyn 是微软为 C# 设计的一套分析器,它具有很强的扩展性.以至于我们只需要编写很少量的代码便能够分析我们的项目文件. 作为 Roslyn 入门篇文章,你将可以通过本文学习如何开始编写一个 R ...

  2. [git]安装git-pylint-commit-hook提高python项目中的代码质量

    什么是'git-pylint-commit-hook' 我在工作中,团队为了保证代码和提高代码的质量,要求每个项目都要求安装git-pylint-commit-hook,它是个钩子,会在你提交代码到本 ...

  3. 针对MSHFlexGrid的一系列通用方法-项目中实践代码分享

    1.给MSHFlexGrid填充数据通用方法 '自定义报表填充程序 fgrid Public Function ShowformfData(Resultset As ADODB.Recordset, ...

  4. 吐槽一下项目中的代码坏味道:滥用java常量

    我们的项目中是否充斥着类似以下的代码呢?定义一个专门存放常量的java类(接口),非常多其它类依赖该常量类. public interface IConstant { int ZERO = 0; St ...

  5. 最新广商小助手 项目进展 OpenGL ES 3D在我项目中引用 代码太多只好选重要部分出来

    package com.example.home; import java.io.IOException; import java.io.InputStream; import javax.micro ...

  6. Vue项目中的http请求统一管理

    module.exports = { dev: { // Paths assetsSubDirectory: '/', assetsPublicPath: '/', proxyTable: { /op ...

  7. 做web项目时对代码修改后浏览器端不生效的应对方法(持续更新)

    做web项目时,经常会遇到修改了代码,但浏览器端没有生效,原因是多种多样的,我会根据我遇到的情况逐步更新解决办法 1.运行的时候采用debug模式,一般情况下使用项目部署按钮右边那个按钮下的tomca ...

  8. Metalama简介3.自定义.NET项目中的代码分析

    本系列其它文章 使用基于Roslyn的编译时AOP框架来解决.NET项目的代码复用问题 Metalama简介1. 不止是一个.NET跨平台的编译时AOP框架 Metalama简介2.利用Aspect在 ...

  9. 使用spring提供的ReflectionUtils简化项目中反射代码的复杂性

    在项目中有时候我们会使用到反射的功能,如果使用最原始的方法来开发反射的功能的话肯能会比较复杂,需要处理一大堆异常以及访问权限等问题.spring中提供了ReflectionUtils 这个反射的工具类 ...

随机推荐

  1. 分库分表神器 Sharding-JDBC,几千万的数据你不搞一下?

    今天我们介绍一下 Sharding-JDBC框架和快速的搭建一个分库分表案例,为讲解后续功能点准备好环境. 一.Sharding-JDBC 简介 Sharding-JDBC 最早是当当网内部使用的一款 ...

  2. linux中KVM桥接网卡br0

    在centos虚拟化当中需要增加一个桥接网卡,然后将虚拟化当中的机器的网卡桥接到桥接网卡,下面将描述设置方法: 查看现有网卡 [root@zb ~]# vim /etc/sysconfig/netwo ...

  3. du查看的目录大小与df查看的大小不同的时候用lsof查找

    首先MAN一下两个命令,看一下解释的区别: du - estimate file space usage df - report file system disk space usage du估计文件 ...

  4. go get以后下载的包不在src下而在pkg的问题

    我的GOPATH是这样的 但是当我go get下载包之后 下载的却不在src,而是在 $GOPATH$/pkg 下 原因可能是之前第一次go get下载, GitHub的速度太慢了,我更改了代理,使用 ...

  5. win10安装MySQL5.7.31 zip版

    因为我之前卸载了安装的(msi,exe)格式的MySQL,现在重新安装zip版的MySQL. 1,下载MySQL MySQL下载地址 : https://dev.mysql.com/downloads ...

  6. mysql之数据库备份

    1.可视化工具Navicat for mysql进行操作数据库备份 (1)备份数据库 (2)将备份的数据库进行加载

  7. matlab 向量操作作业

    写出下列语句的计算结果及作用 clear    清除所有变量 clc    清屏 A = [2 5 7 1 3 4];    创建行向量并赋值 odds = 1:2:length(A);    冒号操 ...

  8. Spring扩展之一:ApplicationContextInitializer

    1.介绍 用于Spring容器ConfigurableApplicationContext在刷新之前初始化Spring的回调接口. 通常在需要对应用程序上下文进行一些编程初始化的Web应用程序中使用. ...

  9. NProgress使用教程

    GitHub地址 rstacruz/nprogress: For slim progress bars like on YouTube, Medium, etc (github.com) 演示网站 N ...

  10. Docker学习第三天(Docker数据卷管理)

    1.Docker数据卷管理 在Docker中,要想实现数据的持久化(所谓Docker的数据持久化即数据不随着Container的结束而结束),需要将数据从宿主机挂载到容器中.目前Docker提供了三种 ...