如何在构建时以不同的方式构建dev env和prod env?等)数据库配置

时间:2019-01-25 00:46:25

标签: javascript reactjs create-react-app

我正在使用create-react-app,我应该分别设置项目prod env,dev env并部署到dev服务器和prod服务器(分开)

现在,我找不到解决此问题的好方法,我正在更改自己的配置值,然后再部署到服务器(prod或dev)。但它是 效率低下且不稳定。

例如)

// config.json

...
"db": {
    "prodSchema": "foo_p",
    "devSchema": "foo_d",
    "username": "dany",
    "password": "****",
    "host": "123.456.789.111:3306",
    "dialect": "mysql"
},
...

并使用

// config use.js

在部署,检查和更改...

//db.connect(config.prodSchema)
db.connect(config.devSchema)

我想在create-react-app中以不同的方式设置'yarn build'产品和开发环境之前的路

1 个答案:

答案 0 :(得分:2)

使用webpack,您可以应用environment plugin并检查环境变量以检查应使用的配置文件。

browserify具有transformation called envify出于相同的目的。

然后您可以执行以下操作:

import axios from "axios";

const env = process.env.NODE_ENV || "development";

const config = {
  development: {
    baseURL: "http://127.0.0.1:3000",
  },
  staging: {
    baseURL: "https://mysuperservice.herokuapp.com",
  },
  production: {
    baseURL: "https://mysuperservice.com",
  },
};
const api = axios.create({
  baseURL: config[env].baseURL,
  headers: {
    "x-api-key": "ABC",
  },
});