家具网站源码,陶瓷刀具网站策划书,前端开发工具下载,做鞋的贸易公司网站怎么做好如果你的 Vue 项目使用了 history 模式#xff08;而非默认的 hash 模式#xff09;#xff0c;在纯静态服务器中会出现类似的问题。因为 Vue Router 的 history 模式要求所有未匹配的路径都重定向到 index.html#xff0c;以便 Vue 前端处理路径。
首先在本地执行npm run…如果你的 Vue 项目使用了 history 模式而非默认的 hash 模式在纯静态服务器中会出现类似的问题。因为 Vue Router 的 history 模式要求所有未匹配的路径都重定向到 index.html以便 Vue 前端处理路径。
首先在本地执行npm run build编译项目会生成一个dist的项目源码文件
1.创建一个简单的 HTTP 服务器 修改你的 server.js确保所有未匹配的请求都返回 index.html。
const http require(http);
const fs require(fs);
const path require(path);const PORT 14515;http.createServer((req, res) {let filePath path.join(__dirname, req.url / ? /index.html : req.url);fs.readFile(filePath, (err, data) {if (err) {// 如果文件不存在返回 index.htmlfs.readFile(path.join(__dirname, index.html), (err, indexData) {if (err) {res.writeHead(500, { Content-Type: text/plain });res.end(500 Internal Server Error);} else {res.writeHead(200, { Content-Type: text/html });res.end(indexData);}});} else {// 返回找到的文件const ext path.extname(filePath).toLowerCase();const mimeTypes {.html: text/html,.js: application/javascript,.css: text/css,.json: application/json,.png: image/png,.jpg: image/jpg,.gif: image/gif,.svg: image/svgxml,};res.writeHead(200, { Content-Type: mimeTypes[ext] || application/octet-stream });res.end(data);}});
}).listen(PORT, () {console.log(Server running at http://0.0.0.0:${PORT}/);
});
2.运行 在 dist 目录下启动服务器
node server.jsnohup node server.js //在后台可以运行项目目录
