有时候咱们在代码里须要根据环境变量来决定一些逻辑。常见的好比,在测试环境访问的后端url跟正式环境是不同的。webpack
不依赖框架的话,应当是基于webpack的define-plugin实现。如文档中所示的:git
new webpack.DefinePlugin({ PRODUCTION: JSON.stringify(true), VERSION: JSON.stringify('5fa3b9'), BROWSER_SUPPORTS_HTML5: true, TWO: '1+1', 'typeof window': JSON.stringify('object') });
回到dva。
dva核心是个基于redux封装的数据流方案,也能够当成一个轻量级框架。从框架的角度来说,它其实很轻很轻,几乎没怎么管数据流以外的事情,只是简单地集成了少量几个库造成一个框架。github
roadhog是个服务于框架的命令行工具,主要就是提供dev、build 和 test 等命令,屏蔽了webpack的复杂配置,提供了本身的相对简单的配置能力。web
显然,这里的变量配置应当由roadhog来处理。不要像我当初同样以为dva是个框架就应该有相关功能_(:зゝ∠)_redux
善用搜索引擎,从roadhog文档 - define和相关讨论容易找到方案。roadhog提供了define
选项作DefinePlugin
的事情。
具体使用:编辑.webpacrc.js
后端
export default { define: { 'process.env': {}, 'process.env.NODE_ENV': process.env.NODE_ENV, 'process.env.API_ENV': process.env.API_ENV, }, }