vue2.0报错：Syntax Error: TypeError: eslint.CLIEngine is not a constructor

最新推荐文章于 2024-12-04 10:27:02 发布

原创最新推荐文章于 2024-12-04 10:27:02 发布 · 8.6k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#vue #eslint

FE前端同时被 2 个专栏收录

256 篇文章

订阅专栏

Vue.js

104 篇文章

订阅专栏

本文指导如何在Vue CLI 3项目中将lintOnSave配置为false，以避免每次保存时的eslint验证，提供了解决方法和详细配置示例。

把vue.config.js文件的lintOnSave改为false

lintOnSave配置

Type: boolean | 'warning' | 'default' | 'error'
Default: true

设置是否在开发环境下每次保存代码时都启用 eslint验证

false：关闭每次保存都进行检测
true：开启每次保存都进行检测，效果与warning一样
‘warning’：开启每次保存都进行检测，lint 错误将显示到控制台命令行，而且编译并不会失败。
‘error’：开启每次保存都进行检测，lint 错误将显示到浏览器页面上，且编译失败。
‘default’：同’error’

用法：

module.exports = {
  publicPath: './', // 基本路径
  outputDir: 'dist', // 输出文件目录
  assetsDir: './assets',
  indexPath: 'index.html',
  filenameHashing: true, // 生成的静态资源在它们的文件名中包含了 hash 以便更好的控制缓存
  lintOnSave: false, // eslint-loader 是否在保存的时候检查
}

vue cli 3 lintOnSave 配置有时无效问题

一个使用vue cli 3.2创建的项目，创建时未开启 lintOnSave，后来希望开启并设置为 lintOnSave: ‘error’，但配置不生效。

解决方法1：新创建项目（此时vue cli 版本为 3.4）并开启 lintOnSave，然后删除其中所有文件，将旧有项目所有代码（包括node_modules）移动到新项目文件夹，发现lintOnSave报错页面提示有。

解决方法2：在 vue.config.js 中配置：

module.exports = {
    devServer: {
        overlay: {
            warnings: true,
            errors: true
        }
    },
    lintOnSave: 'error',
    chainWebpack: config => {
        config.module.rule('eslint').use('eslint-loader').loader('eslint-loader').tap(opt => {
            opt.emitWarning = opt.emitError = opt.failOnWarning = opt.failOnError = true;
            return opt;
        });
    }
};