npm start启动服务静态资源404 直接node server.js运行正常

问题现象 #

• 进入项目src文件夹执行node server.js，所有功能运行正常，可通过http://localhost:3000/client/pantry/index.html正常访问本地应用
• 在package.json配置start脚本后启动，控制台正常输出Server listening on port 3000日志，服务启动成功，但访问上述地址返回404 Not Found响应，页面无法加载

// 服务启动监听代码
app.listen(port, () => { 
  console.log(`Server listening on port ${port}`); 
});

已尝试排查操作 #

• 删除node_modules文件夹后重新执行npm install
• 调整package.json内scripts.start的命令路径，尝试过所有可想到的路径写法，包括：

"scripts": {
  "start": "node src/server.js"
}

以及"start": "node ./src/server.js"、"start": "node ../src/server.js"、"start": "node ./../server.js"、"start": "node server.js"等各类相对路径、绝对路径组合

• 在src目录下分别执行npm start、npm run start测试
• 在项目根目录（MyPantry文件夹）下分别执行npm start、npm run start测试
• 重新安装Node.js环境

初步怀疑方向 #

• 项目文件夹结构存在配置问题
• 静态资源中间件仅在npm脚本启动时触发异常：server.js中配置了app.use("/client", express.static("client"));用于开放client目录的web访问权限，该配置在直接执行node server.js时运行完全正常

根因定位 #

问题出在express.static的路径解析逻辑：传入相对路径时，express.static的路径解析基准是执行node命令时的终端工作目录，而非server.js文件自身所在的目录。
直接进入src目录执行node server.js时，工作目录就是src，如果client静态文件夹存放在src目录下，express.static("client")可以正确匹配到路径，因此访问正常。
通过npm脚本启动时，node进程的默认工作目录是package.json所在的目录（即项目根目录），和脚本里写的server.js路径无关，此时express.static("client")会去项目根目录下查找client文件夹，找不到对应资源就会返回404。

修复方法 #

给express.static传入基于server.js文件位置的绝对路径，和启动时的工作目录解耦，彻底避免路径解析偏差：

1. 在server.js顶部引入Node.js内置path模块：

const path = require('path');

2. 修改静态资源配置规则：
   如果client文件夹和server.js同属src目录，使用以下配置：

app.use("/client", express.static(path.join(__dirname, "client")));

如果client文件夹在项目根目录，和src文件夹同级，调整路径层级即可：

app.use("/client", express.static(path.join(__dirname, "../client")));

修改完成后，无论在哪个目录执行启动命令，静态资源路径都能被正确解析，不会再出现404问题。

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