webpack和ES6-有条件的导入和导出

Question

我有一些如下配置键：

/config
  /db
    /dev.js
    /index.js
    /prod.js

我像这样导入密钥：

import dbConfig from './config/db'

但是在中index.js，我使用CommonJS语法有条件地导出模块。ES6可以做到吗？如果是，怎么办？

module.exports = process.env.NODE_ENV === 'production'
  ? require('./prod')
  : require('./dev');

我正在使用webpack ^4.6.0。尝试了我的运气，babel-plugin-dynamic-import-webpack但没有成功。

我可能不知道我可以使用的一些最佳做法或插件，因此，不胜感激。

Answer 1

我不相信你真的需要担心这个。现代构建系统中存在树修剪算法，可以确保您最终在开发或生产中只有一个版本。

# mockValue.js
const mockValue = 'mock';

export default mockValue;

# realValue.js
const realValue = 'real';

export default realValue;

# test.js
import mockValue from 'mockValue';
import realValue from 'realValue';

let test;
if (process.env.NODE_ENV === 'production') {
  test = realValue;
} else {
  test = mockValue;
}

export default test;

# index.js
import test from 'test';

console.log(test);

在开发过程中，realValue 应该被修剪。在生产构建过程中，mockValue 应该被修剪。为了验证这一点，您可以构建上面的测试项目并检查输出中的“模拟”（但您不太可能找到它）。