如何解决在角2/TSX角文件 - CLI

我有一个.tsx文件并通过如何解决在角2/TSX角文件 - CLI

import {ReactChildComponentView} from "./MessageBox";

在TS文件导入，但是当我运行NG服务，它抛出一个错误

ERROR in ./src/app/react/wrapper.component.ts 
    Module not found: Error: Can't resolve './MessageBox' in '.../src/app/react'

在Chrome浏览器的控制台，我可以看到下面的错误

using description file: .../package.json (relative path: ./src/app/react/MessageBox) 
    as directory 
    .../src/app/react/MessageBox doesn't exist 
    no extension 
    .../src/app/react/MessageBox doesn't exist 
    .ts 
    .../src/app/react/MessageBox.ts doesn't exist 
    .js 
    .../src/app/react/MessageBox.js doesn't exist

好像角度不找.tsx文件。我该如何改变它？

来源

2017-01-22 Felix Junghans

首先，你需要在你的WebPack配置中添加resolve.extensions.tsx，以确保你已经配置的WebPack查找文件与.tsx扩展：

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

然后，你需要有打字稿装载机配置为通过设置test: /\.tsx$/为ts加载程序寻找.tsx文件module.loaders in webpack config：

module: { 
    loaders: [ 
     { 
     test: /\.tsx$/, 
     exclude: /node_modules|typings/, 
     loaders: [ 
      'ts' 
     ] 
     }, 
    // More loaders 
    ] 
}

您也可以找到有关的WebPack的详细信息，并在Typescript Handbook

来源

2017-01-28 12:49:20

反应整合，我不得不做出的WebPack 5.5.1一些变化：在我修改了现有装载机的module.rules节点，把它使用' @ ngtools/webpack'装载机TS用途： { “测试”：/\.tsx?$/， “装载机”： “@ ngtools /的WebPack” }，此外，可能需要修改tsconfig.json在'compilerOptions'下包含''jsx“：”react“' –

它给我一个错误，说'意外的标记你可能需要一个合适的加载器来处理t他的文件类型。“ –

如何解决在角2/TSX角文件 - CLI

回答

相关问题