因果類型腳本接口XXX不能同時擴展類型'YYY

Question

我的tsconfig.json是

{
  "compilerOptions": {
    "outDir": "./dist/",
    "sourceMap": true,
    "module": "es6",
    "target": "es5",
    "jsx": "react",
    "allowJs": true,
    "preserveConstEnums": true,
    "removeComments": true,
    "noImplicitAny": false,
    "moduleResolution": "node",
    "noUnusedParameters": true
  },
  "include": [
    "./src/**/*"
  ],
  "exclude": [
    "node_modules",
    "@typings",
    "typings/main",
    "typings/main.d.ts",
    "typings/index.d.ts"
  ],
  "paths": {
    "react": ["node_modules/@types/react"]
  }
}

而且我已經將karma-typescript添加到我的配置中

settings.frameworks.push('karma-typescript');
settings.preprocessors['test-bundler.js'].unshift('karma-typescript');
settings.karmaTypescriptConfig = {
    tsconfig: './tsconfig.json',
};

使用webpack，開發服務器和編譯工作正常。

這是一個虛擬測試

describe('Root', () => {
    it('should pass', () => {
        console.log('done');
    });
});

運行測試時，我得到

node_modules/@types/react/index.d.ts（2736,19）：錯誤TS2320：接口'ElementClass'無法同時擴展類型'Component'和'Component'。 類型為“組件”和“組件”的命名屬性“ props”不同。

和那些相似。 如果我刪除settings.preprocessors['test-bundler.js'].unshift('karma-typescript'); 然后測試運行正常（但是當我開始導入源文件時，我無法預編譯打字稿。

到底是怎么回事？ 我的常規構建和開發服務器在tsconfig.json運行良好

Answer 1

到底是怎么回事

您在編譯上下文中有兩個react.d.ts 。

固定

刪除node_modules和所有package-lock （或yarn鎖定），然后再次npm install 。

如果它不起作用，請找到無效的模塊（所有模塊都應具有react.d.ts作為peerDependency而非硬dependency ），並在其項目中報告該模塊。