我正在跟随Cory House的pluralsight课程,学习使用ES6构建React。不幸的是,在设置基础组件的一些初始步骤上卡住了。
在控制台中,我看到以下错误信息:
如果我在我的开发服务器上查看,会看到以下内容:
在控制台中,我看到以下错误信息:
Warning: [react-router] Location "/" did not match any routes
如果我在我的开发服务器上查看,会看到以下内容:
然后,在下面,我看到eslint已经抛出了以下错误:错误 ./src/index.js
警告:[react-router] 地址“/”没有匹配任何路由
所以这应该是非常简单的。然而,查看我的目录结构、C:\Projects\es6react\src\index.js (1/0)
✖ 5:9 在'./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>
);
目录结构
下面是我的package.json
中的scripts
部分:
"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"
},