如何将 nodejs 后端和 vuejs 前端部署到同一个 Amazon EC2 实例答案

【问题标题】：How to deploy a nodejs backend and vuejs frontend to the same Amazon EC2 instance如何将 nodejs 后端和 vuejs 前端部署到同一个 Amazon EC2 实例
【发布时间】：2019-07-02 12:14:25
【问题描述】：

我有一个 vuejs 前端和一个 express nodejs 后端。但是我不知道如何将它们都部署到同一个域名指向它们的同一个 Amazon EC2 实例。请问有人可以帮我吗？或者建议一种更好的方法？

【问题讨论】：

标签： node.js express vue.js amazon-ec2

【解决方案1】：

您可以合并两个 repos 并按如下方式部署后端和前端

在您的 nodejs 应用程序中，打开一个名为 client 的文件夹并将所有 Vue 项目放入其中。
如果您使用的是 Vue CLI，请更改您的 vue.config.js，如下所示在 nodejs 项目的根目录中创建一个 dist 文件夹，如

const path = require('path');

module.exports = {
  outputDir: path.resolve(__dirname, '../dist'),
};

使 nodejs 应用程序的所有 get/post 端点以 /api/ 开头，以免与将所有请求重定向到 /api/ 以外的 vue 客户端应用程序的路径冲突/strong> 路径。
运行 npm run build 在 nodejs 根后端文件夹中创建一个 dist 文件夹
如果您使用的是 express.js，请将 dist 文件夹与 nodejs express 后端类似；

index.js

const express = require('express');
const app = express();

// Serve Vue Dist Folder 
app.use(express.static(__dirname + '/dist'));
app.get('*', (req, res) => res.sendFile(__dirname + '/dist/index.html'));

【讨论】：

谢谢@onuriltan。我能够做到这一点，现在我可以在我的 localhost 3000 服务器端口上看到我的 vuejs 前端。但现在的问题是我无法从我的数据库中获取信息。请问我需要配置什么来解决这个问题？
从数据库中获取信息是什么意思，是指无法从api请求中得到响应吗？
您可以查看my project，您可以将其部署到一个容器中，该容器在同一个 repo 中同时具有前端和后端代码
是的，我的意思是 api 请求。只有发布请求工作正常。获取请求不是。知道可能是什么原因吗？我做了与你的项目完全相同的设置。
现在 GET 请求工作正常。我不得不从你的代码中删除这一行：“app.get('*', (req, res) => res.sendFile(__dirname + '/dist/index.html'));"以便评估我的 Express 路线。感谢您的帮助。

【解决方案2】：

nodejs 与例如express 也可以提供静态内容。只需将您的 vuejs 文件放在 static folder 中即可。

【讨论】：