環境變量的單獨文件 - ReactJS

我有這個環境變量文件，它根據NODE_END導出變量配置。目前生產和開發變量都駐留在一個文件中，代碼如下。我怎樣才能將文件如development.js和production.js分開：環境變量的單獨文件 - ReactJS

if(process.env.NODE_ENV === 'production') { 
    module.exports = { 
     API_URL: "https://test.co/api" 
    } 
} 
else { 
    module.exports = { 
     API_URL: "http://testbeta.co/api" 
    } 
}

來源

2017-02-17 Sydney Loteria

您正在使用的WebPack？ – Chris

您可以使用單獨的文件來橋接它們並導出預期的模塊。例如，在同一文件夾api上製作三個單獨的文件index.js,development.js和production.js。

// production.js 
module.exports = { 
    API_URL: "https://e27.co/api" 
} 

// development.js 
module.exports = { 
    API_URL: "http://e27beta.co/api" 
} 

// index.js 
let exp 
if (process.env.NODE_ENV === 'production') { 
    exp = require('./production.js') 
} else { 
    exp = require('./development.js') 
} 
module.exports = exp

然後你就可以。如果你使用的WebPack需要在其他地方一樣

// elsewhere.js 
const api = require('path_to_api_folder')

來源

2017-02-17 08:11:51 absolutezero

，您可以利用DefinePlugin插件出於這樣的目的：

https://webpack.js.org/plugins/define-plugin/#use-case-service-urls

if(isProd) { 
    config.plugins.push(new webpack.DefinePlugin({ 
    'SERVICE_URL': JSON.stringify("http://prod.example.com") 
    })); 
} else { 
    config.plugins.push(new webpack.DefinePlugin({ 
    'SERVICE_URL': JSON.stringify("http://dev.example.com") 
    })); 
}

來源

2017-02-17 08:48:16 Chris

我爲'process.env.NODE_ENV'的webpackDefinePlugin，我只是想把它放在一個單獨的文件中，而不是在webpack.config.js中 –

只需使用普通的require/import將一個配置文件導入到你的webpack文件中 – Chris

你可以有2個獨立的webpack配置，每個都有相應的SERVICE_URL'S。

// webpack.config.dev.js 
plugins.push(new webpack.DefinePlugin({ 
    'SERVICE_URL': JSON.stringify("http://dev-url.com") 
})); 

// webpack.config.prod.js 
plugins.push(new webpack.DefinePlugin({ 
    'SERVICE_URL': JSON.stringify("http://prod-url.com") 
}));

打造，只是傳遞的WebPack適當的配置：

webpack --config webpack.config.prod.js 
webpack --config webpack.config.dev.js

來源

2017-02-18 13:56:03 grizzthedj

環境變量的單獨文件 - ReactJS

回答

相關問題