我使用了react-router-dom和webpack以及weppack-dev-server进行开发。我的项目正在运行,但是当我在浏览器中用paramameters直接点击url然后它给了我 GET http://localhost:8080/archives/index.js net :: ERR_ABORTED 否则我点击链接组件的同一网址然后它正在运行
//main.js
import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter as Router, Route, hashHistory} from 'react-router-dom';
import Archives from './modules/Archives';
import Layout from './modules/Layout';
import Featured from './modules/Featured';
import Settings from './modules/Settings';
import Home from './modules/Home';
console.log('hi');
ReactDOM.render((
<Router history={hashHistory}>
<div>
<Layout/>
<Route exact path={'/'} component={Home}/>
<Route path={'/featured'} component={Featured}/>
<Route path={'/archives/:id'} component={Archives}/>
<Route exact path={'/archives'} component={Archives}/>
<Route path={'/settings'} component={Settings}/>
</div>
</Router>
),document.getElementById('app'));
///////////////////////////////////////////////////////////////////////////
//Layout.js
import React from 'react';
import { Link } from 'react-router-dom';
import '../css/main.css';
const bstyle = {
color:'white',
background: 333333,
margin: '-9px',
};
export default class Layout extends React.Component{
render() {
return(
<div>
<h1>React Application</h1>
<ul>
<li><Link className='linktext' to='/'>Home</Link></li>
<li><Link className='linktext' to='/archives'>Archives</Link></li>
<li><Link className='linktext' to='/featured'>Featured</Link></li>
<li><Link className='linktext' to='/settings'>Settings</Link></li>
</ul>
{this.props.children}
</div>
)
}
}