2

我一直在玩得很开心,试图看看我是否无法让我的打字稿构建忽略 node_modules(特别是 React)。我的 tsconfig.json 告诉它忽略该文件夹,但它仍在编译中,我不知道为什么。我怀疑可能是因为它是由包含文件中的文件导入的,也许?

这是一个错误的例子,其中有很多:

ERROR in /Users/rw3iss/Sites/site/src/project/public/node_modules/@types/react/index.d.ts
(3606,13): error TS2403: Subsequent variable declarations must have the same type.  Variable 'feTile' must be of type 'SVGProps<SVGFETileElement>', but here has type 'SVGProps<SVGFETileElement>'.

我的 tsconfig.json 看起来像这样:

{
  "compilerOptions": {
    "jsx": "react",
    "target": "es6",
    "module": "commonjs",
    "noEmitOnError": true,
    "noImplicitAny": false,
    "experimentalDecorators": true,
    "sourceMap": true,
    "strictNullChecks": true,
    "forceConsistentCasingInFileNames": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noFallthroughCasesInSwitch": true,
    "allowJs": true,
    "outDir": "build",
    "noResolve": false,
    "moduleResolution": "node",
    "typeRoots": [
      "./node_modules/@types",
      "./secure/node_modules/@types",
      "./public/node_modules/@types"
    ],
    "types": [ "react" ]
  },
  "filesGlob": [
  ],
  "include": [
    "secure/src/**/*",
    "public/react_src/**/*"
  ],
  "exclude": [
    "node_modules/**/*",
    "public/node_modules/**/*",
    "secure/node_modules/**/*",
    "public/dist"
  ],
  "types": [ "react" ]
}

我正在尝试用 webpack/ts-loader 编译它,我的 webpack 配置是:

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

var BUILD_DIR = path.resolve(__dirname, 'build');
var APP_DIR = path.resolve(__dirname, 'src');

var config = {

    entry: {
        app: [
            APP_DIR + '/react_src/Secure.tsx',
            APP_DIR + '/react_src/DicomViewer.tsx'
        ]
    },

    output: {
        publicPath: '/',
        path: BUILD_DIR, // 'dist'
        filename: '[name].js', // 'index.js'
        //libraryTarget: 'umd'
    },

    resolve: {
        extensions: ['.js', '.jsx', '.ts', '.tsx'],
        modules: [ 'node_modules', 'src' ]
    },

    module: {
        rules: [
            { 
                test: /\.(t|j)sx?$/, 
                include: APP_DIR,
                exclude: [
                        path.resolve(__dirname, 'node_modules'),
                        '../public/node_modules',
                        '../node_modules'
                    ],
                loader: ['ts-loader']
            }
        ]
    }
};

module.exports = config;

谁能告诉我为什么会发生这些错误,以及如何避免它们以及可能在导入的 node_modules 中弹出的其他错误?

更新: 我删除了“typeRoots”下的所有内容并将“types”设置为[]:

"typeRoots": [],
"types": []

但它仍然抛出相同的错误。我只是想了解为什么...

4

1 回答 1

0

我无法让我的打字稿构建忽略 node_modules(特别是 React)。我的 tsconfig.json 告诉它忽略该文件夹,但它仍在编译中,我不知道为什么。

该错误与@types目录中的反应类型声明有关。即使我们 exclude node_modules,该@types目录也包含在编译中。

以下是来自文档的更多相关信息

默认情况下,所有可见的“@types”包都包含在您的编译中...如果指定了 typesRoots,则仅包含 typeRoots 下的包...如果指定了 types,则仅包含列出的包。

您的 tsconfig 包含一个types属性,该属性指定[ "react" ]. 将属性更改types为空数组[]可能会解决该错误。请注意,types属于compilerOptions不在顶层。

另请参阅https://github.com/Microsoft/TypeScript/issues/11257

于 2017-08-10T05:18:33.703 回答