关于vue eslint ident缩进红色波浪线及尾随空格

一、现象

二、官方说明

三、经验处理方法

3.1、“缩进遗留”及“尾随空格”

3.2、原因

3.3、修正经验

3.4、其他相关的修正经验

一、现象

二、官方说明

Getting Started with ESLint - ESLint - Pluggable JavaScript Linter

其中，看Configuration配置部分

好像，说的含含糊糊......

三、经验处理方法

3.1、“缩进遗留”及“尾随空格”

indent-legacy - ESLint - Pluggable JavaScript Linter

eol-last - ESLint - Pluggable JavaScript Linter

强制一致的缩进的fix补丁，--fix 命令行选项自动修复，在“ESLint v4.0.0中已弃用”。

eol尾随“LF”换行符，而非“尾随空格”，是要求的方式，但实际中，我们不经意的给空格。

那么，怎么办呢？！

3.2、原因

官方在版本过渡期间，为了兼顾老版本的代码，在配置文件“.eslintrc.js”中，配置了“规则rules”：

导致了，缩进为 2 * 2 = 4，js文件一点保存，就起“红色波浪线”而“警示”，只要你看得惯，那你就不改吧？！

3.3、修正经验

3.3.1、方法1

        'indent': [0, 0, {'SwitchCase': 1}],

3.3.2、方法2---直接关掉

        'eol-last': 0,// : ESLint讨厌的文档末尾行的“尾随空格” ：'eol-last': 2,

3.3.3、方法3---需要的文件，首置comment指令

/* eslint-disable eol-last */
/* eslint-disable indent */

当然，如果还要屏蔽掉“禁用尾随空格”的指令，也可一并加上：

/* eslint-disable eol-last */
/* eslint-disable indent */

3.4、其他相关的修正经验

        "vue/max-attributes-per-line": [2, {"singleline": 10,"multiline": {"max": 1,"allowFirstLine": false}}],"vue/singleline-html-element-content-newline": "off","vue/multiline-html-element-content-newline": "off","vue/name-property-casing": ["error", "PascalCase"],"vue/no-v-html": "off",'accessor-pairs': 2,'arrow-spacing': [2, {'before': true,'after': true}],'block-spacing': [2, 'always'],'brace-style': [2, '1tbs', {'allowSingleLine': true}],'comma-style': [2, 'last'],'constructor-super': 2,'curly': [2, 'multi-line'],'dot-location': [2, 'property'],'eqeqeq': ["error", "always", { "null": "ignore" }],'generator-star-spacing': [2, {'before': true,'after': true}],'handle-callback-err': [2, '^(err|error)$'],// 'comma-dangle': [2, 'never'],'camelcase': [0, {'properties': 'always'}],'comma-spacing': [2, {'before': false,'after': true}],'jsx-quotes': [2, 'prefer-single'],// 'key-spacing': [2, {//     'beforeColon': false,//     'afterColon': true// }],'key-spacing': [0, {}],// 'keyword-spacing': [2, {//     'before': false,//     'after': true// }],'keyword-spacing': [0, {}],'new-cap': [2, {'newIsCap': true,'capIsNew': false}],// 'no-unused-vars': [2, {  'vars': 'all',  'args': 'none'  }],'no-unused-vars': [0, []],

module.exports = {/** ：除上述经验配置外：* 主要注意：* 1、以上做的一些配置* 2、src等源代码中：* 2.1、箭头函数 () => 前后空格* 2.2、函数  function aFun() {}  前后空格* 2.3、组件-模板  单双引号* 2.4、组件-脚本  导入模块 { aModule } 对象中前后空格* 3、jsconfig.json*    加compilerOptions选项属性:  "jsx":"preserve"*/
}

module.exports = {
/** ：除上述经验配置外：
* 主要注意：
* 1、以上做的一些配置
* 2、src等源代码中：
* 2.1、箭头函数 () => 前后空格
* 2.2、函数 function aFun() {} 前后空格
* 2.3、组件-模板单双引号
* 2.4、组件-脚本导入模块 { aModule } 对象中前后空格
* 3、jsconfig.json
* 加compilerOptions选项属性: "jsx":"preserve"
*/
}

喜欢的，就收藏并点个赞，鼓励我继续技术的原创写作及经验分享：

部署vue2 element-ui admin_pulledup的博客-CSDN博客

关于vue eslint ident缩进红色波浪线及尾随空格相关推荐

vue项目在vscode中编译eslint报错没显示红色波浪线提示
vue项目在vscode中编译eslint报错没显示红色波浪线提示. 如下图所示: 下图是预期效果: 不符合Eslint校验规则的代码位置都能展示出来,这样一目了然.能帮助我们迅速找到报错的位置. 然 ...
vue3结合ts，导入vue项目文件，代码出现红色波浪线
问题如下: 报错原因:ts识别不出.vue文件! 解决方案如下: 在根目录下面添加一个xxx.d.ts文件, declare module '*vue' {import { ComponentOpti ...
解决vscode红色波浪线的ts报错:找不到模块“store” ts(2307)，不识别@别名路径
使用TS构建vue3项目时,如果使用例如 import { store } from '@/store/user' 发生红色波浪线报错,说明ts不识别@别名,可以修改 tsconfig.json 文件 ...
vue3+ts 项目空格和回车代码出现红色波浪线
新创建了一个vue3+typescript项目,在项目中加一个空格或者回车换行就出现红色波浪线: 我的解决办法是在vsCode的扩展中找到 ESLint 点击禁用然后再点击重新加载就可以解决了
Notepad++写Verilog HDL代码时，在注释语句下出现红色波浪线怎么办？
最近给实验室电脑自费安装了一个固态硬盘,悲催的是系统转移没成功,导致不得不对系统进行重新安装,于是所有软件什么的都得重新安装了,以后买固态硬盘最好还是要买那种具有一条龙服务的硬盘呀,有专门转移系统的软 ...
pycharm导入本地py文件时，模块下方出现红色波浪线时如何解决
pycharm导入本地py文件时,模块下方出现红色波浪线时如何解决文章目录: Reference: 1.https://blog.csdn.net/qq_30622831/article/detai ...
Pycharm中导入的模块名下出现红色波浪线问题
Pycharm中导入的模块名下出现红色波浪线问题(10-2090212) 文章目录: 一.出现红色下滑波浪线的原因一.出现红色下滑波浪线的原因没有正确导入该模块该模块没安装模块命名不正确注意 ...
去除VisualStudio中拼写错误检测的红色波浪线
去除VisualStudio中拼写错误检测的红色波浪线在Visual Assistant中将 Underline spelling errors in comments and strings us ...
idea不自动检查语法_idea自动检查失效-目录中类名下的红色波浪线没有自动消除问题...
自动检查失效-工程类名红色波浪线没有错误也不消除最近打开一个新工程,遇到一个问题,当修改类里面的代码时,中间有语法不正确的情况,这时左边目录结构会有红色下划线,这是正常情况. 问题是: 当我把代码语 ...

关于vue eslint ident缩进红色波浪线及尾随空格

关于vue eslint ident缩进红色波浪线及尾随空格

一、现象

二、官方说明

三、经验处理方法

3.1、“缩进遗留”及“尾随空格”

3.2、原因

3.3、修正经验

3.4、其他相关的修正经验

关于vue eslint ident缩进红色波浪线及尾随空格相关推荐

最新文章

热门文章