Webpack 网页包开发服务器在登录到应用程序时返回404

网页包开发服务器在登录到非索引页面时返回404

问题是当从

apprequest
bundle.js将示例登录到
localhost:8080/页面时http://localhost:8080/page/bundle.js?08386a6ab2de89169893
然后返回404

从索引中尝试请求时
http://localhost:8080/bundle.js?08386a6ab2de89169893
dev server返回200

my webpack.config.js：

const HtmlWebpackPlugin = require('html-webpack-plugin')
const path = require('path')
const webpack = require('webpack')
const CompressionPlugin = require('compression-webpack-plugin')
const createStyledComponentsTransformer = require('typescript-plugin-styled-components').default

const styledComponentsTransformer = createStyledComponentsTransformer()

const basePath = __dirname

module.exports = function(env, arg) {
  const base = {
    context: path.join(basePath, 'src'),
    entry: ['./index.tsx'],
    output: {
      path: path.join(basePath, 'dist'),
      filename: 'bundle.js',
    },
    module: {
      rules: [
        {
          test: /\.(graphql|gql)$/,
          exclude: /node_modules/,
          loader: 'graphql-tag/loader',
        },
        {
          test: /\.tsx?$/,
          loader: 'awesome-typescript-loader',
          options: {
            transpileOnly: true,
            experimentalWatchApi: true,
            getCustomTransformers: () => ({
              before: [styledComponentsTransformer],
            }),
          },
        },
        {
          test: /\.js$/,
          use: ['source-map-loader'],
          enforce: 'pre',
        },
        {
          test: /\.css$/i,
          use: ['style-loader', 'css-loader'],
        },
      ],
    },
    resolve: {
      extensions: ['.mjs', '.tsx', '.ts', '.js'],
      alias: {
        react: path.resolve(__dirname, 'node_modules', 'react'),
        '~': path.resolve('./src'),
      },
    },
    devtool: 'source-map',
    externals: {
      React: 'react',
    },
    devServer: {
      contentBase: path.join(__dirname, 'dist'),
      inline: true,
      compress: true,
      historyApiFallback: true,
      proxy: {
        '/graphql': {
          secure: false,
          target: 'http://gepick.com:4002/graphql',
          changeOrigin: true,
        },
        '/predict': {
          secure: false,
          target: 'http://localhost:5000',
          changeOrigin: true,
        },
      },
    },
    plugins: [
      new HtmlWebpackPlugin({
        filename: 'index.html', //Name of file in ./dist/
        template: 'index.html', //Name of template in ./src
        hash: true,
      }),
    ],
  }

  return base
}

我将
publicPath:'/'
添加到
output

    output: {
      path: path.join(basePath, 'dist'),
      filename: 'bundle.js',
      publicPath: '/',
    },


现在它的工作原理和预期的一样