我在编译我的 react typescript 应用程序时遇到问题答案

【问题标题】：I am having trouble compiling my react typescript application我在编译我的 react typescript 应用程序时遇到问题
【发布时间】：2017-07-19 17:59:02
【问题描述】：

我的应用程序无法编译，我不知道为什么。在更改为打字稿之前，一切正常。现在，当我运行“npm start”时出现错误。

我收到的错误消息：

./src/index.js
Module not found: Can't resolve './components/App' in  /Users/myname/typescript_demo/redux/examples/todos-typescript/src'

index.js

import * as React from 'react';
import { render } from 'react-dom';
import { createStore } from 'redux';
import { Provider } from 'react-redux';
import { App } from './components/App';
import { reducer } from './reducers';

const store = createStore(reducer)

render(
  <Provider store={store}>
    <App />
  </Provider>,
 document.getElementById('root')
)

我的 webpack 文件是什么样子的：

module.exports = {
  entry: "./src/index.tsx",
  output: {
    filename: "bundle.js",
    path: __dirname + "/dist"
},

devtool: "source-map",

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

module: {
    rules: [

        { test: /\.ts|\.tsx?$/, loader: "awesome-typescript-loader" },
        { enforce: "pre", test: /\.js$/, loader: "source-map-loader" },
        { exclude: /node_modules/},

        // All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'.
        //{ enforce: "pre", test: /\.js$/, loader: "source-map-loader" }
        { enforce: "pre", test: /\.js$/, loader: "source-map-loader" }
    ]
},

externals: {
    "react": "React",
    "react-dom": "ReactDOM"
},
devtool: "source-map"
};

【问题讨论】：

标签： reactjs typescript redux

【解决方案1】：

根据你的错误

Module not found: Can't resolve './components/App' in  /Users/myname/typescript_demo/redux/examples/todos-typescript/src'

在你的index.js 你有

import { App } from './components/App';

确保存在相对于磁盘上index.js 位置的components/App.js 文件。

由于您使用的是 .js 文件，因此还要确保您在 tsconfig.json 中启用了 allowJs。

【讨论】：

更多