npm start成功启动后，localhost仅显示homepage.js源代码问题求助

1. 修正服务器路由配置 #

你的server.js大概率是在根路径请求时直接返回了homepage.js的文件内容，而非返回能加载该脚本的HTML页面。

比如用Express框架的话，别这么写：

// 错误写法：直接返回JS源码
app.get('/', (req, res) => {
  fs.readFile('./homepage.js', 'utf8', (err, content) => {
    res.send(content);
  });
});

改成下面两种方式之一：

• 方式一：用静态文件托管，把前端文件放在public目录，让Express自动处理：

  const express = require('express');
  const app = express();
  // 托管public目录下的静态资源
  app.use(express.static('public'));
  // 根路径返回HTML页面（假设public下有index.html，里面已引入homepage.js）
  app.get('/', (req, res) => {
    res.sendFile(__dirname + '/public/index.html');
  });
  

• 方式二：直接返回包含脚本的HTML字符串：

  app.get('/', (req, res) => {
    res.send(`
      <!DOCTYPE html>
      <html>
        <head>
          <meta charset="UTF-8">
        </head>
        <body>
          <!-- 可在此添加页面内容，同时引入你的JS脚本 -->
          <script src="/homepage.js"></script>
        </body>
      </html>
    `);
  });
  

2. 理清文件作用与项目结构 #

• 如果homepage.js是前端脚本：必须通过HTML页面引入，不能让服务器直接返回源码给浏览器。把它放到静态资源目录（比如public），然后在HTML里用<script>标签引入。
• 如果homepage.js是后端脚本：绝对不能暴露给前端，检查路由是否错误指向了这个文件，应该把后端脚本放在非静态目录，仅在服务器内部调用。

3. 检查MIME类型设置（可选） #

如果确实需要返回JS文件（不推荐直接返回给根路径），要确保服务器设置正确的Content-Type：

res.setHeader('Content-Type', 'application/javascript');
res.sendFile('./homepage.js');

注意：用户访问根路径时，浏览器默认期望的是HTML页面，所以优先返回HTML而非直接返回JS。

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