我正在尝试将有角度的应用程序从gulp转换为webpack。在gulp中,根据NODE_ENV,我使用gulp- preprocess替换html页面中的某些变量(例如,数据库名称)。使用webpack达到类似结果的最佳方法是什么?
有两种基本方法可以实现此目的。
new webpack.DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development') }),
请注意,这只会按原样替换匹配项。这就是字符串具有其格式的原因。您可能有一个更复杂的结构,例如那里的一个对象,但您明白了。
new webpack.EnvironmentPlugin(['NODE_ENV'])
EnvironmentPlugin在DefinePlugin内部使用并映射环境值以通过它进行编码。Terser语法。
EnvironmentPlugin
DefinePlugin
或者,您可以通过别名模块使用配置。从消费者方面来看,它看起来像这样:
var config = require('config');
配置本身可能如下所示:
resolve: { alias: { config: path.join(__dirname, 'config', process.env.NODE_ENV) } }
可以说process.env.NODE_ENV是development。它将映射到./config/development.js那时。它映射到的模块可以这样导出配置:
process.env.NODE_ENV
development
./config/development.js
module.exports = { testing: 'something', ... };