Docker容器里跑Node.js服务，前端Vue页面加载空白怎么办？

UI红爱提问于 2026-02-25 20:17:20 阅读 15

前端

我在本地开发时 Vue 项目正常，但打包后放进 Docker 容器，用 Node.js 当静态服务器，页面就一片空白，控制台也没报错，这是啥情况？

我试过把 dist 目录 COPY 到镜像里，也检查了端口映射，8080 能访问到，就是内容不显示。是不是路径配错了？

<template>
  <div id="app">
    <h1>Hello Docker!</h1>
  </div>
</template>

<script>
export default {
  name: 'App'
}
</script>

Docker容器 Node.js

我来解答赞 2 收藏

反馈

1 条解答

百里恩希 Lv1

你这个问题大概率是 Vue 打包用了 history 模式，但 Node.js 静态服务器没配 fallback，所有非根路径请求都返回 404 或空内容，改用 hash 模式或者给 server 加个 * 路由回 index.html 就行：

const express = require('express');

const path = require('path');

const app = express();

app.use(express.static(path.join(__dirname, 'dist')));

app.get('*', (req, res) => {

  res.sendFile(path.join(__dirname, 'dist', 'index.html'));

});

app.listen(8080);

或者直接在 Vue 项目里改 vue.config.js：

module.exports = {

  publicPath: './',

  configureWebpack: {

    devServer: {

      historyApiFallback: true

    }

  }

}

然后重新打包再进容器试试。

2026-02-25 20:18