无法获取 manifest.json 反应 webpack

如何解决无法获取 manifest.json 反应 webpack

我一直在使用 WebPack 运行 TS react 应用程序并遇到一个问题，即它不会加载 manifest.json，因此不会加载选项卡图标：

我使用典型的 React 应用程序结构对其进行了设置，其中默认公共文件夹包含 favicon.ico、manifest.json、徽标 png 等，然后是包含应用程序的 src 文件夹，如下所示：

data = {'candles': [
            {'close': 1260.28,'datetime': 1556029980000,'high': 1260.5,'low': 1260.0,'open': 1260.25,'volume': 2544},{'close': 1260.3501,'datetime': 1556030040000,'high': 1260.61,'low': 1260.3501,'open': 1260.39,'volume': 1703},{'close': 1260.56,'datetime': 1556030100000,'high': 1260.59,'low': 1260.07,'open': 1260.35,'volume': 2156},{'close': 1259.7,'datetime': 1556030160000,'high': 1260.56,'low': 1259.27,'open': 1260.56,'volume': 1320},{'close': 1259.56,'datetime': 1556030220000,'high': 1260.06,'low': 1259.56,'open': 1260.06,'volume': 800}]}

df = pd.DataFrame(data["candles"])

print(df)
      open     high        low      close  volume       datetime
0  1260.25  1260.50  1260.0000  1260.2800    2544  1556029980000
1  1260.39  1260.61  1260.3501  1260.3501    1703  1556030040000
2  1260.35  1260.59  1260.0700  1260.5600    2156  1556030100000
3  1260.56  1260.56  1259.2700  1259.7000    1320  1556030160000
4  1260.06  1260.06  1259.5600  1259.5600     800  1556030220000

这是我的 webpack.config.json 供参考：

My-App
    dist/
    node_modules/
    public/
        favicon.ico
        index.html
        manifest.json
        robots.txt
        ...
    src/

如您所见，我尝试使用 InterpolateHtml 插件，但无论我做什么，我都会遇到如下点击错误

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
// const InterpolateHtmlPlugin = require('interpolate-html-plugin')
module.exports = {
  entry: path.resolve(__dirname,'src','index.tsx'),output: {
    filename: 'bundle.js',path: path.resolve(__dirname,'dist'),publicPath: '/'
  },devtool: "source-map",mode: "development",devServer: {
    historyApiFallback: true,contentBase: path.resolve(__dirname,port: 3000
  },resolve: {
    extensions: ['.js','.ts','.jsx','.tsx']
  },module: {
    rules: [
      {
        test: /\.tsx?$/,exclude: /node_modules/,use: ['ts-loader']
      },{
        test: /\.s(a|c)ss$/,use: [
          'style-loader',{
            loader: 'css-loader',options: {
              modules: {
                localIdentName: '[local]'
              }
            }
          },'sass-loader'
        ]
      },{
        test: /\.css$/i,use: ["style-loader","css-loader"],},{
        test: /\.html/,use: ['html-loader']
      },{
        test: /\.(png|svg|jpg|jpeg|gif|ico)$/,use: ['file-loader?name=[name].[ext]'] // ?name=[name].[ext] is only necessary to preserve the original file name
      },{
        test: /\.woff(2)?$/,use: [
          {
            loader: 'url-loader',options: {
              limit: 10000,name: './font/[hash].[ext]',mimetype: 'application/font-woff'
            }
          }
        ]
      }
    ]
  },plugins: [
    new HtmlWebpackPlugin({
      template: path.resolve(__dirname,'public','index.html'),filename: './index.html',manifest: "./manifest.json"
    }),// new InterpolateHtmlPlugin({
    //   PUBLIC_URL: 'static' // can modify `static` to another name or get it from `process`
    // }),]
};

这是我第一次使用 Webpack，所以我不确定如何调试。任何帮助将不胜感激！