我在编译反应打字稿应用程序时遇到问题

时间:2017-07-19 17:59:03

标签: reactjs typescript redux

我的应用程序无法编译,我不知道为什么。在更改打字稿之前,一切正常。现在,当我运行'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"
};

1 个答案:

答案 0 :(得分:0)

根据您的错误

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';

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

更多

由于您使用的是.js文件,因此请确保在tsconfig.json中启用了allowJs