error in ./src/main.js报错解决

1.报错场景我在操作在Vue框架中使用element-ui组件，准备工作已经完成，然后在powershell上运行项目：npm run serve2.报错详细代码：WAITCompiling...下午8:34:4098% after emitting CopyPluginERRORFailed to compile w

intoSunshine

18281人浏览 · 2022-01-17 21:16:04

intoSunshine · 2022-01-17 21:16:04 发布

1.报错场景

我在操作在Vue框架中使用element-ui组件，准备工作已经完成，然后在powershell上运行项目：npm run serve

2.报错详细代码：

 WAIT  Compiling...                                                                                 下午8:34:40

98% after emitting CopyPlugin

 ERROR  Failed to compile with 1 error                                                              下午8:34:44

 error  in ./src/main.js

Module Error (from ./node_modules/eslint-loader/index.js):

E:\vscode\module\code\vueui\vue_proj_02\src\main.js
   4:1   error  Expected space or tab after '//' in comment    spaced-comment
  12:1   error  Expected indentation of 2 spaces but found 4   indent
  13:1   error  Expected indentation of 2 spaces but found 4   indent
  14:18  error  Newline required at end of file but not found  eol-last

✖ 4 problems (4 errors, 0 warnings)
  4 errors and 0 warnings potentially fixable with the `--fix` option.

Windows PowerShell
版权所有 (C) Microsoft Corporation。保留所有权利。

尝试新的跨平台 PowerShell https://aka.ms/pscore6

3. 分析：

我开始检查main.js中的引入是否写错，确认无误后，百度说可能是vue和element-ui的版本不一致，我也试了，没成功，最后我在保存main.js中，一直报格式错误，于是我找到了报错的真正原因，我们的.eslintrc.js配置文件，检查我们的页面格式不正确，后来查百度说要默认在最后一行加一个空行，还有就是缩进也要修改，改了确实不报错了，但是一保存，格式又恢复了，真是气死我了，那么我只能解决问题

其实这是马后炮了，我的报错原因也告诉我是格式上的错误，只不过我按照以往的经验，查看的是最初报错的地方，后面的代码没有仔细看，以后需要注意

E:\vscode\module\code\vueui\vue_proj_02\src\main.js
   4:1   error  Expected space or tab after '//' in comment    spaced-comment
  12:1   error  Expected indentation of 2 spaces but found 4   indent
  13:1   error  Expected indentation of 2 spaces but found 4   indent
  14:18  error  Newline required at end of file but not found  eol-last

4.解决问题：修改根目录中的配置文件

（1）：在.eslintrc.js文件中的rules中添加，解决缩进问题

 rules: {
 		//下一行为添加的
        'indent': ['off', 2],
        'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
        'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
        'eol-last': 0
    }

（2）：在…editorconfig中将insert_final_newline改为false，也要修改在.eslintrc.js文件中的rules中添加规则，注意这两行代码是在不同文件中修改的，这样需要回车问题也解决了

[*.{js,jsx,ts,tsx,vue}]
indent_style = space
indent_size = 2
trim_trailing_whitespace = true
//下一行为修改的
insert_final_newline = false

'indent': ['off', 2],
        'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
        'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
        //下一行为添加的
        'eol-last': 0