Reactjs 使用dev server时，网页包未将文件发送到index.html

我一直在尝试设置webpack，并在不使用CRA术语的情况下使用typescript进行响应。dev服务器不会将文件发送到要在浏览器中查看的index.html文件。eject上的CRA模板有多个用于构建和开发模式的js脚本，但我想省略它，并尽可能保持结构的干净和简单

Package.json-

  "scripts": {
    "start": "webpack-dev-server --mode development --open --hot",
    "build": "webpack --mode production"
  }

网页包配置-

常量路径=需要“路径” const HtmlWebpackPlugin=require'html-webpack-plugin' const ForkTsCheckerWebpackPlugin=需要'fork-ts-checker-webpack-plugin' const CompressionPlugin=需要“compression-webpack-plugin” const HtmlWebPackChangeAssetExtensionPlugin=需要'html-webpack-change-assets-extensionPlugin' module.exports={ 条目：{ app:path.resolve__dirname，'src/index.tsx' }, 输出：{ 路径：path.resolve__dirname，“dist”， chunkFilename:'[name].[hash].chunk.js',， publicPath:“/codestage” }, devtool:'源映射'， 决心：{ 扩展名：['.ts'，'.tsx'，'.js'] }, 模块：{ StrightExportPresence：没错， 规则：[ { 测试：/\.js$/,， 加载器：require.resolve'babel-loader'， 排除：/node_模块/， 选项：{ 紧凑型：正确 } }, { 测试：/\.tsx？$/,， 包括：path.join\uu dirname，“src”， 排除：/node_模块/， 使用：[ {loader:'babel loader'}， { 加载器：“ts加载器”， 选项：{ transpileOnly：正确 } } ] }, {强制执行：'pre'，测试：/\.js$/，加载程序：'source map loader'} ] }, 插件：[ 新HtmlWebpackPlugin{ 模板：'./index.html'， jsExtension:“.gz”， 文件名：'./index.html' }, 新压缩插件{ 测试：/\.js\？*？$/i， deleteOriginalsets:true }, 新的ForkTsCheckerWebpackPlugin{eslint:true}， 新的HtmlWebPackChangeAssetExtensionPlugin ], 优化：{ runtimeChunk:'single'， 分割块：{ 缓存组：{ 供应商：{ ReuseeExistingChunk:true， 测试：/[\/]节点单元模块[\\/]/,， 名称：'供应商'， 块：'首字母' } } } } } index.html

反应应用程序 目录结构-

浏览器中的Html检查-

---

如何解决这个问题？

事实上，开发服务器是一个开发和调试工具。所有内容都内置在内存中。您可以尝试使用npm运行构建脚本来生成可用于部署的文件。

构建工作正常。但我希望开发过程与WDS无缝连接。js文件甚至没有反映在index.html中。目前还不清楚问题出在哪里。您希望发出哪些未发出的文件？