React-router-dom routing problem, configured historyApiFallback but still request to the backend to report a 404 error.

I configured historyApiFallback, in webpack but the address access is similar to the routing request to the backend that has been defined by / _ b. Requesting an address like / cc that I defined will render the defined error page.
webpack.config.js

< hr >

"use strict"
const path = require (" path")
const HtmlWebpackPlugin = require ("html-webpack-plugin")

const config = {

mode:"development",
entry: "./src/app.js",
output: {
    path: path.resolve(__dirname, "dist")
},
devServer: {
    port: "8088", //
    historyApiFallback: true
},
module: {
    rules: [
        {
            test: /\.js$/,
            use: {
                loader: "babel-loader",
                options:{
                    presets : ["env", "react"]
                }
            }
        }
    ]
},
plugins: [
    new HtmlWebpackPlugin({
        template: "./src/template/index.html",
        filename: "index.html"
    })
]

}

module.exports = config

app.js

< hr >

import React from "react"
import ReactDom from" react-dom"
import {BrowserRouter as Router, Route, Switch} from "react-router-dom"

class An extends React.Component {

render() {
    return (
        <h1>
            A
        </h1>
    )
}

}

class B extends React.Component {

render() {
    return (
        <h1>
            B
        </h1>
    )
}

}

class C extends React.Component {

render() {
    return (
        <h1>
            C
        </h1>
    )
}

}

class ErrorPage extends React.Component {

render() {
    return (
        <h1>
            ErrorPage
        </h1>
    )
}

}

class App extends React.Component {

render() {
    return (
        <Router>
            <Switch>
                <Route exact path="/" component={A}/>
                <Route path="/b" component={B}/>
                <Route path="/c" component={C}/>
                <Route path="/a/c" component={C}/>
                <Route component={ErrorPage}/>
            </Switch>
        </Router>
    )
}

}

ReactDom.render (

)

<App/>,
document.querySelector("-sharpapp")

)

access http://localhost:8088/aa route is not defined. Can render ErrorPage
visit http://localhost:8088/a/c report the following error
GET http://localhost:8088/a/main.js 404( Not Found)
Refused to execute script from" http://localhost:8088/a/main.js" because its MIME type ("text/html") is not executable, And strict MIME type checking is enabled.
I don"t know what went wrong. All kinds of searches. Look at the webpack documentation, but it doesn"t solve the problem. Ask the great god for advice!
I don"t know what the problem is, so I post the dependency version information I used.
"devDependencies": {

"babel-core": "^6.26.3",
"babel-loader": "^7.1.4",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.12.0",
"webpack-cli": "^3.0.3",
"webpack-dev-server": "^3.1.4"

},
"dependencies": {

"react": "^16.4.0",
"react-dom": "^16.4.0",
"react-router-dom": "^4.3.1"

}