为什么JS语法错误，但是webpack还是显示编译成功？

Question

学习webpack4的时候，使用hook

const config = require(./webpack.config.js)
const compiler = webpack(config)

compiler.hooks.invalid.tap('invalid', () => {
  console.log('Compiling...');
});

compiler.hooks.done.tap('done', stats => {
  const statsData = stats.toJson({
    all: false,
    warnings: true,
    errors: true,
  });
  console.log(statsData);
  console.log(chalk.green('Compiled successfully!'));
})

然后我在页面故意打印一个为定义变量 console.log(test) test 我没有定义。但是webpack还是能编译成功。。。 statsData 打印出来的数据 errors 为啥会是空数组，页面是报错了的。我应该如何捕获到这错误呢？

Answer 1

这种你得上ESlint.

Answer 2

test 未定义并不是语法错误，因为js是弱类型语言，它本身无法区分test 是global 对象里面的变量还是未定义，所以webpack判断不出来。