js 项目引入ts 迁移上的一个问题

Question

react-js项目，现引入typescript， 安装了 typescript @types/react @types/node 等，配置了tsconfig.json

{
  "compilerOptions": {
    "experimentalDecorators": true,
    "allowJs": true,
    "target": "es2015",
    "module": "commonjs",
    "allowSyntheticDefaultImports": true,
    "baseUrl": "src",
    // "alwaysStrict": true,
    "jsx": "react",
    "traceResolution": true,
    "paths": {
      "$component/*": [
        "component/*"
      ],
      "$config/*": [
        "config/*"
      ],
      "$utils/*": [
        "utils/*"
      ],
      "$utils": [
        "utils/index.js"
      ],
    },
    "typeRoots": [
      "node",
      "node_modules/@types",
      "./typings"
    ]
  },
  "exclude": [
    "node_modules",
    "dist",
    "**/*.test.ts",
    "public"
  ]

}

npm start 的时候会报一些问题，但是不影响项目运行

======== Resolving type reference directive 'webpack', containing file '/Users/mypc/Desktop/webpack-demo/node_modules/dll-link-webpack-plugin/dist/index.d.ts', root directory '/Users/mypc/Desktop/webpack-demo/node,/Users/mypc/Desktop/webpack-demo/node_modules/@types,/Users/mypc/Desktop/webpack-demo/typings'. ========
Resolving with primary search path '/Users/mypc/Desktop/webpack-demo/node, /Users/mypc/Desktop/webpack-demo/node_modules/@types, /Users/mypc/Desktop/webpack-demo/typings'.
Directory '/Users/mypc/Desktop/webpack-demo/node' does not exist, skipping all lookups in it.
Looking up in 'node_modules' folder, initial location '/Users/mypc/Desktop/webpack-demo/node_modules/dll-link-webpack-plugin/dist'.
Directory '/Users/mypc/Desktop/webpack-demo/node_modules/dll-link-webpack-plugin/dist/node_modules' does not exist, skippingall lookups in it.
File '/Users/mypc/Desktop/webpack-demo/node_modules/dll-link-webpack-plugin/node_modules/webpack.d.ts' does not exist.
Directory '/Users/mypc/Desktop/webpack-demo/node_modules/dll-link-webpack-plugin/node_modules/@types' does not exist, skipping all lookups in it.
'package.json' does not have a 'typings' field.
'package.json' does not have a 'types' field.
'package.json' has 'main' field 'lib/webpack.js' that references '/Users/mypc/Desktop/webpack-demo/node_modules/webpack/lib/webpack.js'.
'package.json' does not have a 'typesVersions' field.
Found 'package.json' at '/Users/mypc/Desktop/webpack-demo/node_modules/webpack/package.json'. Package ID is 'webpack/lib/webpack.d.ts@4.17.1'.
File '/Users/mypc/Desktop/webpack-demo/node_modules/webpack.d.ts' does not exist.
'package.json' does not have a 'typings' field.
'package.json' does not have a 'types' field.
File '/Users/mypc/Desktop/webpack-demo/node_modules/webpack/index.d.ts' does not exist.
File '/Users/mypc/Desktop/webpack-demo/node_modules/@types/webpack.d.ts' does not exist.
Directory '/Users/mypc/Desktop/node_modules' does not exist, skipping all lookups in it.
File '/Users/mypc/node_modules/webpack.d.ts' does not exist.
Directory '/Users/mypc/node_modules/@types' does not exist, skipping all lookups in it.
Directory '/Users/node_modules' does not exist, skipping all lookups in it.
Directory '/node_modules' does not exist, skipping all lookups in it.
======== Type reference directive 'webpack' was not resolved. ========
======== Resolving type reference directive 'webpack', containing file '/Users/mypc/Desktop/webpack-demo/node_modules/dll-link-webpack-plugin/dist/CacheController.d.ts', root directory '/Users/mypc/Desktop/webpack-demo/node,/Users/mypc/Desktop/webpack-demo/node_modules/@types,/Users/mypc/Desktop/webpack-demo/typings'. ========
Resolving with primary search path '/Users/mypc/Desktop/webpack-demo/node, /Users/mypc/Desktop/webpack-demo/node_modules/@types, /Users/mypc/Desktop/webpack-demo/typings'.
Directory '/Users/mypc/Desktop/webpack-demo/node' does not exist, skipping all lookups in it.
Looking up in 'node_modules' folder, initial location '/Users/mypc/Desktop/webpack-demo/node_modules/dll-link-webpack-plugin/dist'.
Directory '/Users/mypc/Desktop/webpack-demo/node_modules/dll-link-webpack-plugin/dist/node_modules' does not exist, skippingall lookups in it.
File '/Users/mypc/Desktop/webpack-demo/node_modules/dll-link-webpack-plugin/node_modules/webpack.d.ts' does not exist.
Directory '/Users/mypc/Desktop/webpack-demo/node_modules/dll-link-webpack-plugin/node_modules/@types' does not exist, skipping all lookups in it.
'package.json' does not have a 'typings' field.
'package.json' does not have a 'types' field.
'package.json' has 'main' field 'lib/webpack.js' that references '/Users/mypc/Desktop/webpack-demo/node_modules/webpack/lib/webpack.js'.
'package.json' does not have a 'typesVersions' field.
Found 'package.json' at '/Users/mypc/Desktop/webpack-demo/node_modules/webpack/package.json'. Package ID is 'webpack/lib/webpack.d.ts@4.17.1'.
File '/Users/mypc/Desktop/webpack-demo/node_modules/webpack.d.ts' does not exist.
'package.json' does not have a 'typings' field.
'package.json' does not have a 'types' field.
File '/Users/mypc/Desktop/webpack-demo/node_modules/webpack/index.d.ts' does not exist.
File '/Users/mypc/Desktop/webpack-demo/node_modules/@types/webpack.d.ts' does not exist.
Directory '/Users/mypc/Desktop/node_modules' does not exist, skipping all lookups in it.
File '/Users/mypc/node_modules/webpack.d.ts' does not exist.
Directory '/Users/mypc/node_modules/@types' does not exist, skipping all lookups in it.
Directory '/Users/node_modules' does not exist, skipping all lookups in it.

'package.json' does not have a 'typings' field.

这些问题是如何导致的，如何修复？ 谢谢

Answer 1

https://github.com/mozilla/so...

Answer 2

因为你用了webpack但是ts却找不到webpack的类型定义文件，也就是*.d.ts。你可以在配置文件中加一个ts编译目录的约束，比如在exclude中把引用webpack的文件或目录去掉，exclude: ["webpack"]