找不到模塊：錯誤：無法解析模塊「路線」

我在Cory House的pluralsight course之後關於在ES6中構建React。不幸的是，我陷入了第一個步驟之一，設置了基本的組件。找不到模塊：錯誤：無法解析模塊「路線」

在我看到下面的錯誤信息控制檯：

Warning: [react-router] Location "/" did not match any routes

如果我看在我開發服務器我看到下面的

ERROR in ./src/index.js

Warning: [react-router] Location "/" did not match any routes

然後在下面，我看到eslint已經踢出以下錯誤：

C:\Projects\es6react\src\index.js (1/0)

✖ 5:9 routes not found in './routes' import/named

所以這個應該非常簡單。然而，看着我的目錄結構，index.js文件和routes.js沒有什麼突出的......即使大約30分鐘後。

index.js

import 'babel-polyfill'; 
import React from 'react'; 
import {render} from 'react-dom'; 
import {Router, browserHistory} from 'react-router'; 
import {routes} from './routes'; 
import './styles/styles.css'; 
import '../node_modules/bootstrap/dist/css/bootstrap.min.css'; 

render(
    <Router history={browserHistory} routes={routes} />, 
    document.getElementById('app') 
);

routes.js

import React from 'react'; 
import {Route,IndexRoute} from 'react-router'; 
import App from './components/App'; 
import HomePage from './components/home/HomePage'; 
import AboutPage from './components/about/AboutPage'; 

export default(
    <Route path="/" component={App}> 
     <IndexRoute component={HomePage} /> 
     <Route path="about" component={AboutPage}/> 
    </Route> 
);

目錄結構

而且萬一我的scripts部分從我package.json：

"scripts": { 
    "prestart": "babel-node tools/startMessage.js", 
    "start": "npm-run-all --parallel open:src lint:watch test:watch", 
    "open:src":"babel-node tools/srcServer.js", 
    "lint": "node_modules/.bin/esw webpack.config.* src tools", 
    "lint:watch": "npm run lint -- --watch", 
    "test":"mocha --reporter progress tools/testSetup.js \"src/**/*.test.js\"", 
    "test:watch": "npm run test -- --watch" 
    },

來源

2017-08-11 NealR

您正在使用默認的出口，需要導入它作爲默認的（無大括號）：

import routes from './routes';

在另一方面你可以使用命名的出口和進口的名字是：

// index.js 
export const routes = ... 

// routes.js 
import {routes} from './routes';

來源

2017-08-11 18:47:49 madox2

就在我的面前......謝謝 – NealR

歡迎您:) – madox2

因爲你是從做默認出口10文件未命名爲導出，並將其導入爲命名導出。

使用此：

import routes from './routes';  //remove {}

來源

2017-08-11 18:48:01

您已經使用在routes.js「出口默認」，這意味着將其導入，您需要使用：

的進口途徑從「./routes」;

在您的代碼中，您使用了{routes}，這些{routes}會在導出時沒有默認情況下導入。

來源

2017-08-11 18:48:59 shtanton

找不到模塊：錯誤：無法解析模塊「路線」

回答

相關問題