关闭webpack对ts的编译

添加了ts-loader去编译ts代码,多了ts -> js 编译的步骤,自然会增加一些编译时间,为了尽可能减少编译时间。

我们可以,在webpack中设置ts-loader:

module.exports = {
  // ...
  test: /.tsx?$/,
  use: [
      loader: 'ts-loader',
      options: {
        transpileOnly: true,

设置transpileOnly为true, 就会关闭项目运行时的类型检查,只做编译。

为了获得运行时的类型检查,就引入另一个webpack plugin fork-ts-checker-webpack-plugin ,这个插件会将ts的类型检查和eslint的语法检查运行在一个单独的进程中。

插件配置:

module.exports = {
  // ...
  plugins: [
    new ForkTsCheckerWebpackPlugin({
    eslint: {
      files: './src/**/*.{ts,js,vue}',
    logger: {
      devServer: false,
      infrastructure: 'console',
      issues: 'console',
    issue: {
      include: (issue) => issue.severity === 'error',
分类:
前端
  •