如何使用webpack进行开发和部署的不同文件？

Question

我有一些基本上存储一些数据的配置文件。 但是，我使用不同的数据进行开发和部署。

每当我尝试部署文件时，我都不想手动更改文件。我也不想在部署之前更改import语句。

例如，

。我有一些代码

import './config/data.js'

我不想修改此内容。我只希望data.js的内容在开发和部署之间发生变化。

如何设置webpack来实现这一目标？

Answer 1

我实现这一目标的方法是使用此文件的不同版本，例如dev.js，stag.js，prod.js等。

然后我告诉webpack复制正确的文件，并使用config.js

将其重命名为CopyPlugin

 var argv = require('yargs').argv;
 var ENV = argv.env;

 new CopyPlugin([
    {
        from: path.join(__dirname, 'config/properties/' + ENV + '.js'),
        to: '<path-to-config-file>/config.js'
    }
];

然后我运行webpack --env=dev并且webpack完成了所有的魔术。