大佬教程收集整理的这篇文章主要介绍了在 Node.js Express 上托管 Vue.js 应用程序 - 在 cPanel 上 - 仅加载 index.html,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我在 Node.Js Express 应用程序上托管一个 Vue.Js 应用程序,该应用程序在本地运行时运行良好。当我将它上传到 cPanel 时,它只加载 index.HTML,留下一个空白页面和几个 404 错误,用于所有位于它旁边的“丢失”文件。
节点:app.Js
const express = require("express");
const cors = require("cors");
const path = __dirname + '/clIEnt';
const app = express();
app.use('/',express.static(path));
app.use(cors({ origin: '*' }));
app.get('/test',function (req,res) {
res.send("API TEST!");
});
// set port,Listen for requests
const PORT = 8080;
app.Listen(PORT,() => {
console.log(`Server is running on port ${PORT}.`);
});
节点:package.Json
{
"name": "basic_node_app","version": "1.0.0","description": "A Basic Node App to serve something.","main": "app.Js","author": "","dependencIEs": {
"cors": "^2.8.5","express": "^4.17.1"
}
}
VUE:index.HTML
<!DOCTYPE HTML>
<HTML lang="">
<head>
<Meta charset="utf-8">
<Meta http-equiv="X-UA-Compatible" content="IE=edge">
<Meta name="vIEwport" content="wIDth=device-wIDth,initial-scale=1">
<link rel="icon" href="/favicon.ico">
<title>basic_vue_app</title>
<link href="/Js/app.62f5dd50.Js" rel="preload" as="script">
<link href="/Js/chunk-vendors.2b964eb5.Js" rel="preload" as="script">
</head>
<body><noscript><strong>We're sorry but basic_vue_app doesn't work properly without JavaScript enabled. Please enable it
to conTinue.</strong></noscript>
<div ID="app"></div>
<script src="/Js/chunk-vendors.2b964eb5.Js"></script>
<script src="/Js/app.62f5dd50.Js"></script>
</body>
</HTML>
VUE:App.vue
<template>
<div>
<label>THIS IS A GOOD TEST</label>
<label>API WORKS -> {{ APIresult }}</label>
</div>
</template>
<script>
import Axios from "axios";
export default {
name: "App",data() {
return {
APIresult: "",};
},mounted() {
Axios.get("/test").then((res) => {
this.APIresult = res.data;
});
},};
</script>
<style>
</style>
VUE:dist 文件夹
在我的 cPanel 上,这是我的结构: image1
我正在像这样运行节点应用程序: image2
最后,我的问题。当我在本地运行它时,我在浏览器上看到了这个: image3
但是当我部署它并在 cPanel 上运行它时,我得到: image4
在此先感谢您的帮助。 最好的问候,
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)
以上是大佬教程为你收集整理的在 Node.js Express 上托管 Vue.js 应用程序 - 在 cPanel 上 - 仅加载 index.html全部内容,希望文章能够帮你解决在 Node.js Express 上托管 Vue.js 应用程序 - 在 cPanel 上 - 仅加载 index.html所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。