Vue在服务器上有自己的后台代码（Node.js+Vue.js）。

Question

所以......对于我的工作，我正在做一个软件解决方案，帮助我们的员工有一个集中的位置来做他们的工作，因为我们将过渡到微软365Azure环境。我和我的同事决定使用Vue.js来控制应用程序的视图，而Node.js则是处理后端。

我们所做的事情。

1. 通过MSAL实现单点登录 (这已经是工作了)
2. 动态模块加载 (这个也可以，我们可以在不需要重启服务器的情况下上传、更新、删除后台功能)

我们要找的是

1. 由于我们使用MSAL来实现SSO，而这些代码需要在软件包的任何页面上运行，我们选择了SPA，因为无论你在哪个URI上，都需要运行相同的代码，这样我们就有了一个。'主页' 而各个应用程序则通过Vue-router加载进来。
2. 根据我们添加的应用列表，动态创建Vue-router的方法。

的问题。

现在我已经提供了一些信息，我们终于到了我提出问题的部分。

由于上级对我们的限制，我们只能得到1个可用的端口（443端口），这意味着（根据我们在网上能找到的资料）Vue-cli几乎是不可能的，因为我们有自己的后台代码也需要运行。这意味着我们自己的后台服务器需要为Vue页面提供服务，因此我们失去了一些从Vue-cli获得的功能。

也就是说，在我们的测试中，我们通过使用CDN库让Vue-router工作，但这也带来了一个问题，那就是我们无法从父节点访问数据，而这是我们需要能够访问的，因为我们需要能够使用上层代码来请求获取数据。

那么对于实际的问题。

1. 有没有办法使用Vue -cli AND 你自己的后端代码在同一个Node进程上？
2. 如果没有，我们如何使用Vue-router和Vue-components并访问父数据，而不需要使用Vue-cli为我们构建应用？

在这两个问题上，我们自己查找都没有找到任何结果，也没有能够通过自己创建代码来实现这个问题（我们对Vue都是相当陌生的，所以还不知道其中的奥妙）。

我希望这里有人能帮助我们解决这2个问题中的任何一个。

Answer 1

正如Ifaruki所评论的那样，vue-cli最终的结果是 dist-文件夹。文件夹里有一个 index.html 以及运行前端所需的所有文件，如js和css。

你如何为这个 index.html 最后是由你决定的，例如，如果你的后台运行的是Express，你可以将你的Vue-dist-文件夹构建到你的Express应用可以到达的地方，并在用户试图到达它的时候为它服务。

app.get('/', (req, res) => {
  res.sendFile(path.join(__dirname, 'dist', 'index.html'));
});

这将在用户GET路由时服务于该页面。这是一个简单的例子，但它是一个通用的想法。

另一个选择是也许运行 Vue Nuxt 而不是Vue。Nuxt是一个使用Vue的服务器端渲染的框架。这意味着你可以把它更多的构建到后端，也许可以把路由分成web和api命名空间。

因为一般情况下不可能在同一个端口上运行两个进程，所以这种解决方案是我能想到的唯一一个。