Question

我正在开发一个将create-react-app与快速服务器连接的应用程序（使用服务器渲染）。我指的是this tutorial。要从服务器渲染文件，代码是

bootstrap.js

require('ignore-styles');
require('babel-register')({
ignore:[/(node-modules)/],
presets:['es2015','react-app']
});
require('./index');

index.js

import express from 'express';
// we'll talk about this in a minute:
import serverRenderer from './middleware/renderer';


const PORT = 3000;
const path = require('path');
// initialize the application and create the routes
const app = express();
const router = express.Router();
// root (/) should always serve our server rendered page
router.use('^/$', serverRenderer);
// other static resources should just be served as they are
router.use(express.static(
    path.resolve(__dirname, '..', 'build'),
    { maxAge: '30d' },
));
// tell the app to use the above rules
app.use(router);
// start the app
app.listen(PORT, (error) => {
    if (error) {
        return console.log('something bad happened', error);
    }

    console.log("listening on " + PORT + "...");
});

运行命令时

node bootstrap.js

我收到错误

错误：使用babel-preset-react-app要求您指定NODE_ENV或BABEL_ENV个环境变量。有效值为“development”，“test”和“production”。

Answer 1

这里有一些选择。我将介绍最简单的选项。

最简单的方法是运行你的节点bootstrap.js：

NODE_ENV=production BABEL_ENV=production node bootstrap.js

但是每次都记得太久了，所以你可以使用package.json脚本。

如果打开package.json文件，您应该看到一个脚本部分（如果没有，see the doc）。在该脚本部分中，您可以创建自己的脚本。

我主要使用2个脚本，一个用于开发，一个用于生产。所以在你的情况下，如：

"scripts": {
   "start": "NODE_ENV=development BABEL_ENV=development node bootstrap.js node bootstrap.js",
   "serve": "NODE_ENV=production BABEL_ENV=production node bootstrap.js node bootstrap.js"
}

现在您可以像这样运行您的节点应用程序：

开发中

node run start或node start（因为节点启动是节点运行启动的别名）

并在生产中

node run serve（此处没有缩写）

如果您仍然认为您的package.json变得太大，您可以将其抽象为某些.js文件。并相应地将脚本更改为：

"scripts": {
   "start": "node scripts/start.js"
   "serve": "node scripts/serve.js"
}

在这些脚本文件中，您可以在运行应用程序之前定义这两个环境变量。

如何提供`babel-preset-react-app` env变量？

1 个答案: