路由url-parameters

Question

人！

我尝试通过网址传递参数（例如http://localhost:8080/edit/99）。但是犯了一个错误

  

GET http://localhost:8080/edit/bundle.js net :: ERR_ABORTED 99：1拒绝   从＆＃39; http://localhost:8080/edit/bundle.js＆＃39;执行脚本因为   它的MIME类型（＆＃39; text / html＆＃39;）不可执行，并且是严格的MIME类型   检查已启用。

全部在客户端呈现。但它显示甚至错误的文件地址。确实/pyblic/bundle.js

显然，它以错误的方式对待参数。

如果我将参数发送到root（例如http://localhost:8080/99），一切正常。可能是我在react-router中错过了一些。

 import React from 'react';
import { BrowserRouter, Route, Switch} from 'react-router-dom'
import ExpenceDashboardPage from '../components/ExpenceDashboardPage';
import AddExpencePage from '../components/AddExpencePage';
import EditExpencePage from '../components/EditExpencePage';
import HelpPage from '../components/HelpPage';
import NotFoundPage from '../components/NotFoundPage';
import Header from '../components/Header';

const AppRouter = () => (
  <BrowserRouter>
        <div>
          <Header />
          <Switch>
            <Route path="/" component={ExpenceDashboardPage} exact={true} />
            <Route path="/create" component={AddExpencePage} />
            <Route path="/edit/:id" component={EditExpencePage} />
            <Route path="/help" component={HelpPage} />
            <Route component={NotFoundPage} />
          </Switch>
        </div>
  </BrowserRouter>
);

export default AppRouter;

Package.json

    {
  "name": "expensify",
  "version": "1.0.0",
  "main": "index.js",
  "author": "Andrew Mead",
  "license": "MIT",
  "scripts": {
    "serve": "live-server public/",
    "build": "webpack",
    "dev-server": "webpack-dev-server"
  },
  "dependencies": {
    "babel-cli": "6.24.1",
    "babel-core": "6.25.0",
    "babel-loader": "7.1.1",
    "babel-plugin-transform-class-properties": "6.24.1",
    "babel-preset-env": "1.5.2",
    "babel-preset-react": "6.24.1",
    "css-loader": "0.28.4",
    "live-server": "^1.2.0",
    "node-sass": "4.5.3",
    "normalize.css": "7.0.0",
    "react": "15.6.1",
    "react-dom": "15.6.1",
    "react-modal": "2.2.2",
    "react-router-dom": "4.2.2",
    "sass-loader": "6.0.6",
    "style-loader": "0.18.2",
    "validator": "8.0.0",
    "webpack": "3.1.0",
    "webpack-dev-server": "2.5.1"
  },
  "devDependencies": {
    "webpack-dev-middleware": "3.1.2"
  }
}

webpack-confog.js

    const path = require('path');

module.exports = {
  entry: './src/app.js',
  output: {
    path: path.join(__dirname, 'public'),
    filename: 'bundle.js'
  },
  module: {
    rules: [{
      loader: 'babel-loader',
      test: /\.js$/,
      exclude: /node_modules/
    }, {
      test: /\.s?css$/,
      use: [
        'style-loader',
        'css-loader',
        'sass-loader'
      ]
    }]
  },
  devtool: 'cheap-module-eval-source-map',
  devServer: {
    contentBase: path.join(__dirname, 'public'),
    historyApiFallback: true
  }
};