一种将MERN应用程序部署到Azure而不是Heroku的方法

问题描述：

我想知道如何将我的Mern应用程序部署到Azure.我已经搜寻了好几天，这让我非常沮丧.当我构建我的应用程序时，它显然只会构建客户端.如何将整个项目上传到Azure并运行应用程序的客户端和服务器端?

I was wondering how to deploy my mern app to Azure. I've been googling for days and it got me really frustrated. When I build my app it obviously only builds the client side. How can I upload my whole project to Azure and run the client side as well as the server side of the app?

我想避免使用Heroku，而直接从Azure运行我的项目.

I'd like to avoid Heroku and directly run my project from Azure.

我可以使用任何工具进行构建吗?

Are there any tools I can use for the build?

非常感谢！

答

为了使MERN应用程序在Azure上运行，您必须配置您的应用程序以通过express显示您的静态React构建.

In order to make a MERN app work on Azure, you have to configure your app to display your static react build through express.

编辑您的快递 server.js 并添加以下内容:

Edit your express server.js and add this:

const path = require("path"); // on top

// Serve Static assests if in production
if (process.env.NODE_ENV === "production") {
  app.use(express.static("client/build")); // change this if your dir structure is different
  app.get("*", (req, res) => {
    res.sendFile(path.resolve(__dirname, "client", "build", "index.html"));
  });
}

然后，将此脚本行添加到您的快递 package.json :

Then, add this script line to your express package.json:

"scripts": {
    "start": "node server.js",
    "azure": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client && npm run start"
  }

注意:编辑此内容以满足您的目录结构.

Note: Edit this to meet your directory structure.

就是这样，现在将您的应用程序上载到Azure，并在Azure应用程序设置的环境变量中将您的快速端口设置为 80 .

That's it, now upload your app to Azure and set your express port to 80 in the environment vars in your Azure application settings.

一种将MERN应用程序部署到Azure而不是Heroku的方法

相关推荐