Question

我不了解部署网站的差异＆＃34;静态＆＃34;与使用快递。 create-react-app中的文档说你不需要快递来启动服务器吗？那么你在哪里以及如何部署这个应用程序？我不明白。我过去常常使用express创建server.js，然后再部署到像Heroku这样的东西。

部署

npm run build使用您应用的生产版本创建一个构建目录。设置您最喜爱的HTTP服务器，以便为您的网站访问者提供index.html，并向/static/js/main。<hash>。js等静态路径发送请求，并提供/static/js/main.<hash>.js的内容文件。

来自他们的文档：

静态服务器

对于使用Node的环境，处理此问题的最简单方法是安装服务器并让其处理其余部分：

npm install -g serve
serve -s build

上面显示的最后一个命令将为端口5000上的静态站点提供服务。与许多服务的内部设置一样，可以使用-p或--port标志调整端口。

运行此命令以获取可用选项的完整列表：

serve -h

其他解决方案

您不一定需要静态服务器才能在生产中运行Create React App项目。 它可以很好地集成到现有的动态中。

这是使用Node和Express的程序化示例：

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

app.use(express.static(path.join(__dirname, 'build')));

app.get('/', function (req, res) {
  res.sendFile(path.join(__dirname, 'build', 'index.html'));
});

app.listen(9000);

我不明白为什么你不想用快递来运行它（我猜这叫做＃34;动态＆＃34;？）。如果你还没有明确的设置怎么办？我不会静静地运行这个＆＃34;。我过去只运行过带快递的应用程序。

Answer 1

静态部署站点意味着您已经有了在生产服务器（Apache，Nginx，Heroku，S3等）中使用HTTP提供静态文件的意思。这些可以在下面的解释中处理第2点和第3点，因此您不需要在生产服务器中启动Express或Serve。

您可能需要在生产计算机中旋转HTTP Server有几个原因，而且不限于create-react-app。

您可以使用附加到快速服务器的Webpack Dev Middleware和Webpack Hot Middleware来重新加载热模块。 Webpack热模块重新加载通过在客户端中注入代码来工作，该代码使用HTTP服务器提供的WebSocket端点来监听文件中的更改。
有时您需要使用AJAX以及HTML和JavaScript动态加载静态资源（图像，字体）。由于Cross Origin Requests仅限于HTTP，大多数浏览器都不允许这样做。
如果您需要使用BrowserHistory使用干净URL进行客户端路由，则需要使用带有重写规则的HTTP服务器，使用Express可以轻松完成。

部署create-react-app - 静态与动态？

1 个答案: