背景

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

于是搜索了一下,可以用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
        'rules': {
    'indent': [
    'warn',
    'tab'
    //强制统一缩进
    ],
    'linebreak-style': [
    'error',
    'windows'
    //Windows的行结尾方式
    ],
    'quotes': [
    'warn',
    'single'
    //单引号
    ],
    'semi': [
    'warn',
    'never'
    //不加分号
    ]
    }
  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. QQ群web前端分析一——准备部分

    Vary:Accept-Encoding的用途 2012-09-06 11:47:08|  分类: rhel_apache|字号 订阅     查看网页的response header一般都有Vary ...

  2. 第05组 Alpha冲刺 (3/6)

    .th1 { font-family: 黑体; font-size: 25px; color: rgba(0, 0, 255, 1) } #ka { margin-top: 50px } .aaa11 ...

  3. 弹性盒模型flex-grow的计算

    flex-grow属性是弹性盒布局模块的子属性. 它定义了弹性项目在必要时增长的能力. 它接受作为比例的无单位值. 它决定了项目应在伸缩容器内部占用多少可用空间. 例如,如果所有项目的flex-gro ...

  4. TIP/Collision-Free Video Synopsis Incorporating Object Speed and Size Changes Code

    代码地址  https://github.com/scutlzk/Collision-Free-Video-Synopsis-Incorporating-Object-Speed-and-Size-C ...

  5. 基于FFmpeg的Dxva2硬解码及Direct3D显示(三)

    初始化Direct3D 目录 初始化Direct3D 创建Direct3D物理设备对象实例 创建Direct3D渲染设备实例 创建Direct3D视频解码服务 Direct3D渲染可以通过Surfac ...

  6. python之 《zip,lambda, map》

    1.zip 对于zip我们一般都是用在矩阵上 eg: a = [1,2,3] b = ['a', 'b', 'c'] x = zip(a, b) print(x) print(list(x)) 结果是 ...

  7. 03 原型模式(prototype)

    03 原型模式(prototype) 1 克隆羊问题 现在有一只羊tom,姓名为: tom.年龄为: 1,颜色为:白色,请编写程序创建和tom羊属性完全相同的10只羊. 2 传统方式解决 思路 cla ...

  8. 5G时代,URL Rewrite 还吃香吗

    URL Rewrite是网站建设中经常用到的一项技巧,通过 rewrite 我们能够屏蔽服务器运行态的信息,包括服务的程序.参数等等,给用户呈现美化后的URL,同时对搜索引擎更加友好,方便我们网站的推 ...

  9. 【深度分析】:阿里,腾讯面试题 SpringBoot整合Spring MVC

    Java学习总结 SpringBoot整合Spring MVC 1.SpringMVC概述 MVC(Model–view–controller)是软件工程中的一种软件架构模式,基于此模式把软件系统分为 ...

  10. ubuntu安装php的 mongodb扩展

    wget https://pecl.php.net/get/mongodb-1.2.6.tgztar -zxvf mongodb-1.2.6.tgz cd mongodb-1.2.6 /usr/bin ...