vuecli关闭eslint,vue cli报错

　　本文主要介绍了vue-cli创建项目时，esLint验证导致的错误或警告的问题及解决方法，具有很好的参考价值。希望对你有帮助。如有错误或不足之处，请不吝赐教。

vue-cli创建项目时由esLint校验导致报错或警告

　　vue-cli创建项目后，编写代码控制台变成黄色。

　　但是代码执行不受影响。

　　但就是看着不舒服。

　　这个问题我上网搜了一下，记得项目初始化的时候安装了esLint验证工具。

　　嗯，我看很多方法如下。

　　1、因为你设置了eslint，如果你不想有规范的js代码，可以重新初始化关掉eslint。

　　用ESLint lint你的代码？(是/否)在此步骤中选择否。

　　bulid/webpack.base.conf.js中有如下配置：

　　模块：{

　　规则：[

　　.(config.dev.useEslint？[createlingrule()]:[])，

　　点击config.dev.useEslint，发现是在config/index.js中配置的

　　Uselint: true，把//改成false就行了。

　　2、万能方法，就是在报错的JS文件中第一行写上

　　/* eslint-disable */

　　使用/* eslint-disable */忽略文件中的所有警告。

　　简单粗暴高效

　　但既然人家说我错了，这肯定不好。我得改变这种良好的意识。

　　我认为我们应该正视自己的错误，勇于改正。

　　对于so的所有错误信息，都一一进行了修改，真的学到了很多，哈哈哈。然后我就按照他的规格写了，那我岂不是成了enenenhahaha？

　　我又在做什么梦了

　　言归正传，把遇到的错误信息整理一下。

　　1.ESLint：Strings must use single quote

　　该字符串必须用单引号括起来。

　　2.Expected indentation of 2 spaces but found 4

　　Eslint不喜欢制表符缩进。你可以用两个空格来缩进。好了，我现在已经开始改了~

　　如果实在改不了可以

　　修改eslint配置文件。eslintrc.js

　　规则：{

　　//缩进

　　//缩进:2，

　　//indent: [2，2，{SwitchCase: 1}]，

　　缩进:[1，2]，

　　}

　　3.Missing space before value for key components’

　　也就是在强制属性值之前，也就是冒号之后，习惯性的加一个空格，这样可以避免这首歌的错误提示~

　　4.Newline required at end of file but not found

　　在单个文件组件的最后一个/style之后，应该更改一行，并且只能使用一行。如果太多，将会报告一个错误。

　　其他的就不一一列举了，但是有一些需要注意的地方。

　　{},

　　{}

　　{}, {

　　}

　　注意：逗号后面也应该加一个空格。

　　好了，这就是我对这个规范的一点点体会，后面再补充~

eslint语法限制项目报错解决

　　从网上找了一个实用的项目。npm安装后，我开始了项目，出现了如下这么多警告和错误，让我看起来很傻：

　　命令行脚本语言

　　PS F:\ vue . news-主npm运行开发

　　vue . news @ 2 . 0 . 0 dev F:\ vue . news-master

　　web pack-dev-server-open-inline-progress-config build/web pack . dev . conf . js

　　95%发射

　　已编译警告，包含2个警告15:04:08

　　http://eslint.org/docs/rules/indent需要缩进0个空格，但找到了1个

　　src\App.vue:15:1

　　/*全球推出VueAwesomeSwiper carousel插件*/

　　http://eslint.org/docs/rules/spaced-comment在注释中的“/*”后需要异常块、空格或制表符

　　src\App.vue:15:2

　　/*全球推出VueAwesomeSwiper carousel插件*/

　　http://eslint.org/docs/rules/spaced-comment在注释中的“*/”前需要空格或制表符

　　src\App.vue:15:2

　　/*全球推出VueAwesomeSwiper carousel插件*/

　　http://eslint.org/docs/rules/no-unused-vars“VueAwesomeSwiper”已定义，但从未使用过

　　src\App.vue:16:8

　　从“vue-awesome-swiper”导入VueAwesomeSwiper

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:16:50

　　从“vue-awesome-swiper”导入VueAwesomeSwiper

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:17:36

　　导入" swiper/dist/CSS/swiper。CSS”；//这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/spaced-comment在注释中的"//"后需要空格或制表符

　　src\App.vue:17:37

　　导入" swiper/dist/CSS/swiper。CSS”；//这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/no-multiple-empty-lines不允许有一个以上的空行

　　src\App.vue:18:1

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:20:47

　　从" @/组件/公共/头"导入AppHead

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:21:47

　　从" @/组件/公共/菜单"导入AppMenu

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:22:45

　　从" @/组件/公共/导航"导入应用导航

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:23:47

　　从" @/组件/公共/英尺"导入AppFoot

　　12个问题(12个错误，0个警告)

　　错误：

　　6 http://eslint.org/docs/rules/semi

　　3 http://eslint.org/docs/rules/spaced-comment

　　1 http://eslint.org/docs/rules/no-multiple-empty-lines

　　1 http://eslint.org/docs/rules/no-unused-vars

　　1 http://eslint.org/docs/rules/indent

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:40:36

　　导入" swiper/dist/CSS/swiper。CSS”；这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/spaced-comment在注释中的"///"后需要空格或制表符

　　src \组件\选择。vue:40:37

　　导入" swiper/dist/CSS/swiper。CSS”；这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:41:57

　　从“vue-awesome-swiper”导入{ swiper，swiper slide }；

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:43:58

　　从" vuex "导入{ mapState，mapMutations，map actions }。

　　四个问题(4个错误，0个警告)

　　错误：

　　3 http://eslint.org/docs/rules/semi

　　1 http://eslint.org/docs/rules/spaced-comment

　　您可以使用特殊注释来禁用某些警告。

　　使用//eslint-disable-next-line忽略下一行。

　　使用/* eslint-disable */忽略文件中的所有警告。

　　等待编译.15:05:01

　　95%发射

　　已编译的警告有两个警告15:05:02

　　http://eslint.org/docs/rules/no-unused-vars"VueAwesomeSwiper"已定义，但从未使用过

　　src\App.vue:16:8

　　从“vue-awesome-swiper”导入VueAwesomeSwiper

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:16:50

　　从“vue-awesome-swiper”导入VueAwesomeSwiper

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:17:36

　　导入" swiper/dist/CSS/swiper。CSS”；//这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/spaced-comment在注释中的"//"后需要空格或制表符

　　src\App.vue:17:37

　　导入" swiper/dist/CSS/swiper。CSS”；//这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/no-multiple-empty-lines不允许有一个以上的空行

　　src\App.vue:18:1

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:20:47

　　从" @/组件/公共/头"导入AppHead

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:21:47

　　从" @/组件/公共/菜单"导入AppMenu

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:22:45

　　从" @/组件/公共/导航"导入应用导航

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:23:47

　　从" @/组件/公共/英尺"导入AppFoot

　　9个问题(9个错误，0个警告)

　　错误：

　　6 http://eslint.org/docs/rules/semi

　　1 http://eslint.org/docs/rules/no-multiple-empty-lines

　　1 http://eslint.org/docs/rules/spaced-comment

　　1 http://eslint.org/docs/rules/no-unused-vars

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:40:36

　　导入" swiper/dist/CSS/swiper。CSS”；这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/spaced-comment在注释中的"///"后需要空格或制表符

　　src \组件\选择。vue:40:37

　　导入" swiper/dist/CSS/swiper。CSS”；这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:41:57

　　从“vue-awesome-swiper”导入{ swiper，swiper slide }；

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:43:58

　　从" vuex "导入{ mapState，mapMutations，map actions }。

　　四个问题(4个错误，0个警告)

　　错误：

　　3 http://eslint.org/docs/rules/semi

　　1 http://eslint.org/docs/rules/spaced-comment

　　您可以使用特殊注释来禁用某些警告。

　　使用//eslint-disable-next-line忽略下一行。

　　使用/* eslint-disable */忽略文件中的所有警告。

　　等待编译.15:05:05

　　95%发射

　　已编译的警告有两个警告15:05:06

　　http://eslint.org/docs/rules/no-unused-vars"VueAwesomeSwiper"已定义，但从未使用过

　　src\App.vue:16:8

　　从“vue-awesome-swiper”导入VueAwesomeSwiper

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:16:50

　　从“vue-awesome-swiper”导入VueAwesomeSwiper

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:17:36

　　导入" swiper/dist/CSS/swiper。CSS”；//这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/spaced-comment在注释中的"//"后需要空格或制表符

　　src\App.vue:17:37

　　导入" swiper/dist/CSS/swiper。CSS”；//这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/no-multiple-empty-lines不允许有一个以上的空行

　　src\App.vue:18:1

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:20:47

　　从" @/组件/公共/头"导入AppHead

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:21:47

　　从" @/组件/公共/菜单"导入AppMenu

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:22:45

　　从" @/组件/公共/导航"导入应用导航

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:23:47

　　从" @/组件/公共/英尺"导入AppFoot

　　9个问题(9个错误，0个警告)

　　错误：

　　6 http://eslint.org/docs/rules/semi

　　1 http://eslint.org/docs/rules/no-multiple-empty-lines

　　1 http://eslint.org/docs/rules/spaced-comment

　　1 http://eslint.org/docs/rules/no-unused-vars

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:40:36

　　导入" swiper/dist/CSS/swiper。CSS”；这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/spaced-comment在注释中的"///"后需要空格或制表符

　　src \组件\选择。vue:40:37

　　导入" swiper/dist/CSS/swiper。CSS”；这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:41:57

　　从“vue-awesome-swiper”导入{ swiper，swiper slide }；

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:43:58

　　从" vuex "导入{ mapState，mapMutations，map actions }。

　　四个问题(4个错误，0个警告)

　　错误：

　　3 http://eslint.org/docs/rules/semi

　　1 http://eslint.org/docs/rules/spaced-comment

　　您可以使用特殊注释来禁用某些警告。

　　使用//eslint-disable-next-line忽略下一行。

　　使用/* eslint-disable */忽略文件中的所有警告。

　　等待编译.15:05:07

　　95%发射

　　已编译警告，包含2个警告15:05:08

　　http://eslint.org/docs/rules/no-unused-vars"VueAwesomeSwiper"已定义，但从未使用过

　　src\App.vue:16:8

　　从“vue-awesome-swiper”导入VueAwesomeSwiper

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:16:50

　　从“vue-awesome-swiper”导入VueAwesomeSwiper

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:17:36

　　导入" swiper/dist/CSS/swiper。CSS”；//这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/spaced-comment在注释中的"//"后需要空格或制表符

　　src\App.vue:17:37

　　导入" swiper/dist/CSS/swiper。CSS”；//这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/no-multiple-empty-lines不允许有一个以上的空行

　　src\App.vue:18:1

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:20:47

　　从" @/组件/公共/头"导入AppHead

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:21:47

　　从" @/组件/公共/菜单"导入AppMenu

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:22:45

　　从" @/组件/公共/导航"导入应用导航

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:23:47

　　从" @/组件/公共/英尺"导入AppFoot

　　9个问题(9个错误，0个警告)

　　错误：

　　6 http://eslint.org/docs/rules/semi

　　1 http://eslint.org/docs/rules/no-multiple-empty-lines

　　1 http://eslint.org/docs/rules/spaced-comment

　　1 http://eslint.org/docs/rules/no-unused-vars

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:40:36

　　导入" swiper/dist/CSS/swiper。CSS”；这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/spaced-comment在注释中的"///"后需要空格或制表符

　　src \组件\选择。vue:40:37

　　导入" swiper/dist/CSS/swiper。CSS”；这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:41:57

　　从“vue-awesome-swiper”导入{ swiper，swiper slide }；

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:43:58

　　从" vuex "导入{ mapState，mapMutations，map actions }。

　　四个问题(4个错误，0个警告)

　　错误：

　　3 http://eslint.org/docs/rules/semi

　　1 http://eslint.org/docs/rules/spaced-comment

　　您可以使用特殊注释来禁用某些警告。

　　使用//eslint-disable-next-line忽略下一行。

　　使用/* eslint-disable */忽略文件中的所有警告。

　　等待编译.15:05:09

　　95%发射

　　警告已编译，有2个警告15:05:09

　　http://eslint.org/docs/rules/no-unused-vars"VueAwesomeSwiper"已定义，但从未使用过

　　src\App.vue:16:8

　　从“vue-awesome-swiper”导入VueAwesomeSwiper

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:16:50

　　从“vue-awesome-swiper”导入VueAwesomeSwiper

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:17:36

　　导入" swiper/dist/CSS/swiper。CSS”；//这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/spaced-comment在注释中的"//"后需要空格或制表符

　　src\App.vue:17:37

　　导入" swiper/dist/CSS/swiper。CSS”；//这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/no-multiple-empty-lines不允许有一个以上的空行

　　src\App.vue:18:1

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:20:47

　　从" @/组件/公共/头"导入AppHead

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:21:47

　　从" @/组件/公共/菜单"导入AppMenu

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:22:45

　　从" @/组件/公共/导航"导入应用导航

　　http://eslint.org/docs/rules/semi额外分号

　　src\App.vue:23:47

　　从" @/组件/公共/英尺"导入AppFoot

　　9个问题(9个错误，0个警告)

　　错误：

　　6 http://eslint.org/docs/rules/semi

　　1 http://eslint.org/docs/rules/no-multiple-empty-lines

　　1 http://eslint.org/docs/rules/spaced-comment

　　1 http://eslint.org/docs/rules/no-unused-vars

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:40:36

　　导入" swiper/dist/CSS/swiper。CSS”；这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/spaced-comment在注释中的"///"后需要空格或制表符

　　src \组件\选择。vue:40:37

　　导入" swiper/dist/CSS/swiper。CSS”；这里注意具体看使用的版本是否需要引入样式，以及具体位置。

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:41:57

　　从“vue-awesome-swiper”导入{ swiper，swiper slide }；

　　http://eslint.org/docs/rules/semi额外分号

　　src \组件\选择。vue:43:58

　　从" vuex "导入{ mapState，mapMutations，map actions }。

　　四个问题(4个错误，0个警告)

　　错误：

　　3 http://eslint.org/docs/rules/semi

　　1 http://eslint.org/docs/rules/spaced-comment

　　您可以使用特殊注释来禁用某些警告。

　　使用//eslint-disable-next-line忽略下一行。

　　使用/* eslint-disable */忽略所有警告

　　ngs in a file.

　　经过百度查询，原来eslint是一个语法检查工具，但是限制很严格，在我的vue文件里面很多空格都会导致红线(红线可以关闭提示)，虽然可以关闭，但是在编译的时候老是会跳出来，所以能关闭是最好的了。

　　关闭方法：在build/webpack.base.conf.js文件中，注释或者删除掉：module->rules中有关eslint的规则：

　　module: {

　　 rules: [

　　 //...(config.dev.useEslint ? [createLintingRule()] : []), // 注释或者删除

　　 {

　　 test: /\.vue$/,

　　 loader: vue-loader,

　　 options: vueLoaderConfig

　　 ...

　　 }

　　 ]

　　}

　　然后再重新运行一下npm run dev或者构建命令 npm run build就可以啦。

　　以上为个人经验，希望能给大家一个参考，也希望大家多多支持我们。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。

vuecli关闭eslint,vue cli报错

目录

vue-cli创建项目时由esLint校验导致报错或警告

eslint语法限制项目报错解决

相关文章阅读