从现有的 Express 应用程序集成和服务 React-Admin

Question

在我的项目中，我需要一个管理员应用程序。我偶然发现了管理员反应。看起来它确实做了我需要它做的事情。我检查了他们的tutorial。做了一些草稿，并得到它运行（按照教程）。

但是我有一个具有路由的 Express 应用程序并且 API 已经在工作，而且我还有一个由 Express 应用程序提供服务的 React 应用程序。我想改为提供 Admin-React，换句话说，删除现有的 React 应用程序并开始将 React-Admin 自定义为静态资源。简单地说，我现有的 Express 应用程序应该服务于 React-Admin 并将现有的 API 暴露给它。

查看教程，我没有找到如何操作的信息。它有 yarn start 并在端口 3000 上启动运行。

我在这里似乎遗漏了一些非常基本的东西。是否有该设置的示例？

这是我的 Express.js，它已经为 public 文件夹中的 React 应用程序（不是 React Admin）提供服务。

'use strict';
/* jshint camelcase:false */

require('dotenv').config();

if (process.env.NODE_ENV === undefined) {
    throw new Error('No environment variable was set. For development use [export NODE_ENV=dev].');
}

let express = require('express');
var favicon = require('serve-favicon');
let path = require('path');
let cookieParser = require('cookie-parser');
let bodyParser = require('body-parser');
let expressValidator = require('express-validator');
let configuration = require('./app/Configuration');
let app = configuration.getApp();
let config = configuration.getParameters();
let errorHandler = require('./src/Error/Handler');
let session = require('client-sessions');

app.use(require('./src/Twig/ExtendWithCustomFunctions').extend());

app.use(session({
    cookieName: 'session',
    secret: 'xxxxxxx',
    duration: 12 * 60 * 60 * 1000,
    activeDuration: 2 * 60 * 60 * 1000 
}));

app.use(bodyParser.json());
app.use(errorHandler.bodyParser);
app.use(expressValidator());
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use(favicon(__dirname + '/public/favicon.ico'));

configuration.setErrorHandler(errorHandler);
configuration.initializeControllers(__dirname);

configuration.initializeErrorHandling();

module.exports = app;

Answer 1

从 Express 端点为 React Admin 提供服务的唯一方法是先构建它。

如果您按照教程进行操作，您应该有运行一个 create-react-app 应用程序，因此您可以运行以下命令来捆绑您的应用程序：

npm run build
# or
yarn build

您的捆绑包文件将在 static 文件夹下可用。

然后，您可以将这些文件移动到您的 Express 应用程序的一个子文件夹中，您可以在其中使用 express.static.

为它们提供服务

有关 create-react-app 构建和部署的更多信息：https://facebook.github.io/create-react-app/docs/deployment

甚至还有一个如何提供构建服务的示例：https://facebook.github.io/create-react-app/docs/deployment#other-solutions

从现有的 Express 应用程序集成和服务 React-Admin

Integrate and serve React-Admin from existing Express application

express

reactjs

react-admin