如何在 React 的客户端中判断环境是生产环境还是测试环境

Question

如何在React应用中知道当前环境是生产环境还是预发布环境？

在后端/Node.js中，我们有`process.env.STAGE_NAME`来获取环境信息，但是这种方式在客户端不起作用。 这是`package.json`文件。如何在客户端获取该信息？

"scripts": {
    "postinstall": "cd ./localDb && sls dynamodb install && cd ../",
    "buildServer": "tsc -b ./server/tsconfig.json",
    "buildClient": "next build ./client",
    "build": "npm run buildServer && npm run buildClient",
    "build:dev": "npm run buildServer && NODE_ENV=development  npm run buildClient",
    "dev": "node --inspect server/build/index.js",
    "start": "NODE_ENV=production node server/build/index.js",
    "testClient": "nyc --reporter=html --reporter=text mocha --timeout 15000 --reporter mochawesome --exit",
    "testServer": "nyc --reporter=html --reporter=text mocha --timeout 15000 --reporter mochawesome --exit server/build/tests/*.js",
    "lintServer": "tslint 'server/**/*.ts' --quiet --project server/tsconfig.json",
    "lintClient": "eslint '**/*.{js,jsx}' --quiet",
    "lint": "npm run lintClient && npm run lintServer",
    "format": "prettier --write '**/*.{js,jsx,css,scss,ts}'",
    "test": "npm run testClient && NODE_ENV=testing npm run testServer",
    "local:db": "cd ./localDb && sls dynamodb start && dynamodb-admin"
  },

- Mark James

---

你在使用相同的命令进行暂存和生产构建吗？ - Vaibhav Singh

Answer 1

你可以这样做，

"scripts": {
    "build": "npm run buildServer && npm run buildClient",
    "build:dev": "npm run buildServer && NODE_ENV=development  npm run buildClient",
    "build:stage": "npm run buildServer && NODE_ENV=staging npm run buildClient",
  },

现在你可以通过 process.env.NODE_ENV 了解环境。

如果你使用 create-react-app 创建应用程序，我建议使用.env文件。查看该链接以进行进一步阅读，链接

- Vaibhav Singh

Answer 2

取决于您如何运行React应用程序以及在package.json中定义了什么。

取决于您的package.json和NODE_ENV=参数：

为测试环境启动应用程序：npm test

为生产环境启动应用程序：npm start

- Thanh Nguyen Van