在使用 Vue CLI 进行前端开发的过程中，我们经常会用到 ESLint 进行代码规范检查。然而，在开发过程中，会遇到一些 ESLint 报错，比如 “Unexpected console statement” 错误。
这个错误通常是因为在代码中使用了 console 语句，而 ESLint 默认不允许使用 console 语句，因为它们可能会在生产环境中导致问题。但在开发过程中，我们经常需要使用 console 语句来调试代码。
那么，我们该如何解决这个问题呢？本文将为你详细介绍解决方法。
解决方法
方法一：在 ESLint 配置文件中添加规则
在 Vue CLI 3.x 中，ESLint 的配置文件通常是 .eslintrc.js 文件。我们可以在该文件中添加一个规则，允许使用 console 语句。
// .eslintrc.js
module.exports = {
// ...
rules: {
'no-console': 'off',
},
};上述代码中，'no-console': 'off' 规则将禁止 ESLint 报错 console 语句。这种方法可以全局禁止 console 报错，但不建议在生产环境中使用。
方法二：在代码中使用注释
如果你只是想在某个文件或某个函数中使用 console 语句，可以在代码中使用注释来禁止 ESLint 报错。
// eslint-disable-next-line no-console
console.log('Hello, world!');上述代码中，eslint-disable-next-line 注释将禁止下一行的 ESLint 报错。这种方法可以在需要使用 console 语句的地方使用，但不建议在大量代码中使用。
方法三：在 package.json 文件中添加脚本
如果你想在开发环境中使用 console 语句，可以在 package.json 文件中添加一个脚本，禁止 ESLint 报错。
-- -------------------- ---- -------
-- ------------
-
-- ---
---------- -
-------- ---------------- ----- ------ ----------- ---------
--
-- ---
-上述代码中，--silent 选项将禁止 Vue CLI 报错 console 语句。这种方法可以在开发环境中使用，但不建议在生产环境中使用。
总结
ESLint 是一个非常有用的工具，可以帮助我们保持代码的规范和可读性。但在实际开发中，我们经常需要使用 console 语句来调试代码。本文介绍了三种解决方法，包括在 ESLint 配置文件中添加规则、在代码中使用注释和在 package.json 文件中添加脚本。需要根据实际情况选择合适的方法。
示例代码
-- -------------------- ---- -------
-- ------------
-------------- - -
----- -----
---- -
----- -----
--
-------- -
-----------------------
---------------------
--
-------------- -
------- ---------------
--
------ -
------------- ------
--
---- -------------------- ---- -------
-- --------------
----------
---- --------------
------ --- -------
------
-----------
--------
------ ------- -
----- -------------
------ -
------ -
---- -------- -- ---- ------ -----
--
--
--------- -
------------------- ---------
--
--
---------来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6569d224d2f5e1655d256d9c