Javascript index.html不匹配任何路由-reactjs
我收到了以下错误消息:Javascript index.html不匹配任何路由-reactjs,javascript,reactjs,webpack,Javascript,Reactjs,Webpack,我收到了以下错误消息: Warning: [react-router] Location "/Users/sm_emamian/Desktop/react%20js/shadyab/dist/index.html" did not match any routes 网址: 我的webpack.config.js: var path = require('path') var webpack = require('webpack') var AssetsPlugin = require('as
Warning: [react-router] Location "/Users/sm_emamian/Desktop/react%20js/shadyab/dist/index.html" did not match any routes
网址:
我的webpack.config.js
:
var path = require('path')
var webpack = require('webpack')
var AssetsPlugin = require('assets-webpack-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
//var ExtractTextPlugin = require("extract-text-webpack-plugin");
var DEBUG = !(process.env.NODE_ENV === 'production')
if (DEBUG) {
require('dotenv').config()
}
var config = {
devtool: DEBUG ? 'cheap-module-eval-source-map' : false,
entry: {
app: ['./app/app'],
vendor: [
'react',
'react-router',
'redux',
'react-dom',
'lodash',
'bluebird',
'humps',
'history'
]
},
resolve: {
modules: [ path.join(__dirname, 'app'), 'node_modules' ]
},
output: {
path: path.join(__dirname, 'dist'),
filename: '[name].js'
},
plugins: [
//new ExtractTextPlugin('styles.css'),
new HtmlWebpackPlugin(),
new webpack.EnvironmentPlugin(['NODE_ENV', 'API_BASE_URL']),
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery',
'window.jQuery': 'jquery'
})
],
module: {
rules: [
{
test: /\.js$/,
loader: 'babel-loader',
exclude: /node_modules/,
include: __dirname
},
{
// test: /\.css$/,
test:/\.(s*)css$/,
use: [
{ loader: "style-loader" },
{ loader: "css-loader" }
]
}
]
}
}
if (DEBUG) {
config.entry.app.push('webpack-hot-middleware/client?path=/__webpack_hmr')
config.plugins = config.plugins.concat([
new webpack.HotModuleReplacementPlugin(),
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
filname: 'vendor.js'
})
])
config.output.publicPath = '/'
config.module.rules.unshift({
test: /\.js$/,
loader: 'react-hot-loader',
exclude: /node_modules/,
include: __dirname
})
} else {
config.plugins = config.plugins.concat([
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
filname: '[name].[chunkhash].js'
}),
new webpack.optimize.UglifyJsPlugin(),
])
}
module.exports = config
我的路线/index.js
:
import React from 'react'
import { Provider } from 'react-redux'
import { Router, Route, IndexRoute } from 'react-router'
import configureStore from 'store/configureStore'
import App from 'containers/App'
import Home from 'containers/Home'
import Questions from 'containers/Questions'
import Question from 'containers/Question'
import Detail from 'containers/Detail'
import Cart from 'containers/Cart'
import Login from 'containers/Login'
import Profile from 'containers/Profile'
import Category from 'containers/Category'
export default function(history) {
return (
<Router history={history}>
<Route path="/" component={App}>
<Route exact path="/offers/:id" component={Detail} />
<Route path="/cart/cart" component={Cart} />
<Route path="/login" component={Login} />
<Route path="/profile/:section" component={Profile} />
<Route path="/category/:city/:category" component={Category} />
<IndexRoute component={Home} />
</Route>
</Router>
)
}
从“React”导入React
从“react redux”导入{Provider}
从“react Router”导入{Router,Route,IndexRoute}
从“存储/配置存储”导入配置存储
从“容器/应用程序”导入应用程序
从“容器/主页”导入主页
从“容器/问题”导入问题
从“容器/问题”导入问题
从“容器/详细信息”导入详细信息
从“容器/购物车”导入购物车
从“容器/登录”导入登录
从“容器/配置文件”导入配置文件
从“容器/类别”导入类别
导出默认函数(历史记录){
返回(
)
}
我的app.js:
import 'babel-polyfill'
import React from 'react'
import ReactDOM from 'react-dom'
import { browserHistory } from 'react-router'
import configureStore from 'store/configureStore'
import createRoutes from 'routes/index'
import { Provider } from 'react-redux'
import Immutable from 'immutable'
import _ from 'lodash'
let reduxState = {}
if (window.__REDUX_STATE__) {
try {
let plain = JSON.parse(unescape(__REDUX_STATE__))
_.each(plain, (val, key)=> {
reduxState[key] = Immutable.fromJS(val)
})
} catch (e) {
}
}
const store = configureStore(reduxState)
ReactDOM.render((
<Provider store={store}>
{ createRoutes(browserHistory) }
</Provider>
), document.getElementById('root'))
导入“babel polyfill”
从“React”导入React
从“react dom”导入react dom
从“react router”导入{browserHistory}
从“存储/配置存储”导入配置存储
从“路由/索引”导入createRoutes
从“react redux”导入{Provider}
从“不可变”导入不可变
从“lodash”导入
让reduxState={}
如果(窗口状态){
试一试{
让plain=JSON.parse(unescape(uuu REDUX_STATE_uuu))
_.每个(普通,(val,键)=>{
reduxState[key]=Immutable.fromJS(val)
})
}捕获(e){
}
}
常量存储=配置存储(reduxState)
ReactDOM.render((
{createRoutes(浏览器历史记录)}
),document.getElementById('root'))
您正在使用ReactRouter@3,对吗?@havenchykreact router:“^3.0.5”,
不幸的是,最好在codesandbox中有一些工作示例,我看不出真正的问题,因为它可能在网页包配置或路由器配置中