logo标签列表

在node_modules文件夹中的文件出现[TS]错误。

javascripttypescriptwebpackwebpack-cli
7

我想要使用webpack5和webpack-cli启动一个新的typescript项目。但出现了以下错误:

错误信息:

hha@melchia ~/projects/project $ npm run build

> my-webpack-project@1.0.0 build /home/hha/projects/project
> webpack

99% done plugins watchInfo[webpack-cli] Compilation finished
asset main.js 4.7 KiB [compared for emit] (name: main)
runtime modules 668 bytes 3 modules
./src/index.ts 616 bytes [built] [code generated]

ERROR in /home/hha/projects/project/node_modules/webpack/lib/javascript/JavascriptParser.js
[tsl] ERROR in /home/hha/projects/project/node_modules/webpack/lib/javascript/JavascriptParser.js(3272,7)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/webpack/lib/ProgressPlugin.js
[tsl] ERROR in /home/hha/projects/project/node_modules/webpack/lib/ProgressPlugin.js(392,4)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/webpack/lib/optimize/ConcatenatedModule.js
[tsl] ERROR in /home/hha/projects/project/node_modules/webpack/lib/optimize/ConcatenatedModule.js(1470,6)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/webpack/lib/util/semver.js
[tsl] ERROR in /home/hha/projects/project/node_modules/webpack/lib/util/semver.js(43,2)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/webpack/lib/util/semver.js
[tsl] ERROR in /home/hha/projects/project/node_modules/webpack/lib/util/semver.js(45,2)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/webpack/lib/util/semver.js
[tsl] ERROR in /home/hha/projects/project/node_modules/webpack/lib/util/semver.js(282,3)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/webpack/lib/util/registerExternalSerializer.js
[tsl] ERROR in /home/hha/projects/project/node_modules/webpack/lib/util/registerExternalSerializer.js(302,4)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/webpack/lib/stats/StatsFactory.js
[tsl] ERROR in /home/hha/projects/project/node_modules/webpack/lib/stats/StatsFactory.js(146,6)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/webpack/lib/stats/StatsFactory.js
[tsl] ERROR in /home/hha/projects/project/node_modules/webpack/lib/stats/StatsFactory.js(193,6)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/webpack/lib/WebpackOptionsApply.js
[tsl] ERROR in /home/hha/projects/project/node_modules/webpack/lib/WebpackOptionsApply.js(520,6)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/jest-worker/build/index.js
[tsl] ERROR in /home/hha/projects/project/node_modules/jest-worker/build/index.js(55,7)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/jest-worker/build/index.js
[tsl] ERROR in /home/hha/projects/project/node_modules/jest-worker/build/index.js(145,7)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/jest-worker/build/index.js
[tsl] ERROR in /home/hha/projects/project/node_modules/jest-worker/build/index.js(171,9)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/webpack/lib/config/normalization.js
[tsl] ERROR in /home/hha/projects/project/node_modules/webpack/lib/config/normalization.js(127,6)
      TS2578: Unused '@ts-expect-error' directive.

ERROR in /home/hha/projects/project/node_modules/webpack/lib/node/nodeConsole.js
[tsl] ERROR in /home/hha/projects/project/node_modules/webpack/lib/node/nodeConsole.js(56,3)
      TS2578: Unused '@ts-expect-error' directive.

Webpack.config.js:

const path = require('path');
const webpack = require('webpack');

module.exports = {
  mode: 'development',
  entry: './src/index.ts',
  plugins: [new webpack.ProgressPlugin()],

  module: {
    rules: [{
      test: /\.(ts|tsx)$/,
      loader: 'ts-loader',
      include: [path.resolve(__dirname, 'src')],
      exclude: [/node_modules/]
    }]
  },

  resolve: {
    extensions: ['.tsx', '.ts', '.js']
  }
}

Tsconfig.json:

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "noImplicitAny": true,
    "module": "es6",
    "target": "es5",
    "allowJs": true,
    "skipLibCheck": true
  },
  "exclude": [
    "node_modules"
  ]
}

Webpack 信息：

  System:
    OS: Linux 5.4 Ubuntu 20.04.1 LTS (Focal Fossa)
  Binaries:
    Node: 12.18.1 - ~/.nvm/versions/node/v12.18.1/bin/node
    Yarn: 1.22.4 - ~/.nvm/versions/node/v12.18.1/bin/yarn
    npm: 6.14.8 - ~/.nvm/versions/node/v12.18.1/bin/npm
  Browsers:
    Chrome: 86.0.4240.111
    Firefox: 82.0
  Packages:
    terser-webpack-plugin: ^5.0.3 => 5.0.3 
    webpack: ^5.3.2 => 5.3.2 
    webpack-cli: ^4.1.0 => 4.1.0 
  Global Packages:
    webpack-cli: 4.1.0
    webpack: 5.3.2
3个回答
23
在我的情况下，exclude 和 skipLibCheck 都被设置了，但它仍然试图编译node_modules中的文件。最后，我发现某个模块进行了深层导入，其源代码被打包到可分发文件中，像这样：
import {Something} from "some-module/src/something.ts"

移除那个深度导入解决了这个问题，

import {Something} from "some-module"
7

事实证明，我需要更改tsconfig选项include以指定typescript要分析的目录。

根据include选项的文档，默认值为：

如果指定了文件，则为[ ]，否则为["**/*"]

因此，默认行为是分析包括node_modules在内的所有存储库。

解决方案：

总之，只需编辑include属性以仅包括src文件夹即可：

{
  "include": ["src/**/*"]
}
在一个VS2022的Angular项目中，当我在tsconfig.json的编译器选项中应用了"include": ["src/**/*"]，在错误列表中显示来自node_modules的错误时，该项目无法成功启动 - 它不断地尝试启动并出现异常，然后在无限循环中再次尝试。 - StackOverflowUser
1
另一个stackoverflow的答案帮助了我： "compilerOptions": { "skipLibCheck": true }， - StackOverflowUser
1
@StackOverflowUser，你能把这个作为答案添加吗？这可能会帮助其他用户。 - Melchia
7
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接