我有一个Vue.js + Node.js应用程序，在我的本地服务器上运行得很好。但是，当我将它部署到一个实时服务器时，我遇到了JavaScript和CSS文件的404错误。我已经验证了这些文件存在于实时服务器上的正确目录中，并且调整了index.html文件中的文件路径。尽管做了这些努力，我仍然无法访问这些文件。
下面是index.html中的相关代码：
client/dist/index.html
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + Vue</title>
<script type="module" crossorigin src="/assets/index-2b384caf.js"></script>
<link rel="stylesheet" href="/assets/index-d1b70ef7.css">
</head>
<body>
<div id="app"></div>
</body>
</html>字符串
server/server.js
const express = require('express');
const cors = require('cors');
const routes = require('./routers');
const app = express();
const path = require('path');
// Serve static files from the Vue.js client build
app.use(express.static(path.join(__dirname, '../client/dist')));
app.use(express.json());
app.use(cors());
app.use('/api', routes);
// For any other routes, serve the Vue.js app
app.get('*', (req, res) => {
res.sendFile(path.join(__dirname, '../client/dist/index.html'));
});
const port = process.env.PORT || 3000;
app.listen(port, () => {
console.log(`Server is running on port ${port}`);
});型
我已经检查了以下内容：
文件位于活动服务器上的正确目录中。考虑到服务器的目录结构，index.html文件中的文件路径正确。服务器配置设置为从客户端目录提供静态文件。我已经清除了浏览器缓存并尝试在匿名窗口中访问文件。尽管进行了这些检查，但在尝试访问JavaScript和CSS文件时仍然收到404错误。
目录结构
工程目录
1.客户端（vuejs）
1.服务器（nodejs）
如有任何关于如何排除故障和解决此问题的建议或想法，我们将不胜感激。谢谢你，谢谢
1条答案
按热度按时间xvw2m8pv1#
最后我能够解决这个问题。实际上我在/client/vite. config. js上配置错误
字符串
加入碱后：'/client/dist/'它的工作原理就像一个魅力。