使用http-server运行TypeScript项目时找不到config.js，报404错误求助

以下是针对该问题的具体排查和解决步骤：

• 检查导入路径的扩展名：浏览器原生ES模块要求导入必须带完整.js后缀。如果index.ts里写的是import config from './config'，编译后的index.js会保留不带扩展名的路径，浏览器会尝试请求/dist/config（而非config.js）导致404。解决方法：在tsconfig.json中设置"moduleResolution": "node16"或"module": "ESNext"，同时在ts文件的导入语句里加上.js后缀（比如import config from './config.js'——虽然源文件是.ts，但编译后会对应dist里的config.js）。

• 确认index.html的script路径和类型：确保index.html里引用index.js的路径正确，并且加上type="module"属性（这是浏览器解析ES模块的必要条件）。正确写法示例：

  <script type="module" src="./dist/index.js" defer></script>
  

  如果路径写错（比如漏了./写成dist/index.js），浏览器会从根域名下查找，导致路径错误。

• 验证http-server的启动目录：必须在项目根目录启动http-server（而非dist目录或其他子目录）。如果启动目录不对，浏览器请求的/dist/config.js会指向错误位置。可直接在浏览器地址栏输入http://127.0.0.1:8080/dist/config.js，如果能正常打开文件，说明路径和启动目录没问题；如果打不开，要么是启动目录错误，要么是config.js未被正确编译生成。

• 检查TypeScript编译输出：确认dist目录下确实存在config.js，且内容正确导出了配置对象。如果未生成，检查tsconfig.json的include选项，确保包含src目录下的所有文件（比如"include": ["src/**/*"]），同时执行tsc重新编译。

内容的提问来源于stack exchange，提问作者skoanton