基于 process.env.NODE_ENV 的条件导出 ES6 模块的可能性？

Question

我写了一个实用程序库，tree-shaking当我的用户使用publishes他们的应用程序时，我想要它们。

在 Webpack v4 中，你需要让你的模块ES6支持tree-shaking，但我也想把 mydevelopment build和 myproduction build分成不同的文件。

我想要的就像 react 的 NPM 模块：

// index.js
'use strict';

if (process.env.NODE_ENV === 'production') {
  module.exports = require('./cjs/react.production.min.js');
} else {
  module.exports = require('./cjs/react.development.js');
}

这让我产生了疑问。

如果我将实用程序模块全部制作出来commonjs，我将永远不会得到tree-shaking，我的应用程序会变得如此庞大。

如果我制作了所有实用程序模块ES6 static export，我将不得不包含development message在production code.

发布两个模块（例如：my-utility和my-utility-es）不会有帮助，因为在开发中，我的代码如下所示：

import { someFunc } from 'my-utility';

但在生产代码中，我将不得不将其更改为：

import { someFunc } from 'my-utility-es';

我怎么解决这个问题？

更新

更清楚地说，我的development build和production build包含不同的源代码（例如：生产版本已删除所有错误消息）。

所以指定 webpack 模式对我来说并不令人满意。

Answer 1

我自己找到了答案，我认为最好的方法是通过babel macros：

\n\n

import { something } from \'myLibrary/macro\';\n\n// In webpack development:\n// \xe2\x86\x93 \xe2\x86\x93 \xe2\x86\x93 \xe2\x86\x93 \xe2\x86\x93 \xe2\x86\x93 \xe2\x86\x93 \xe2\x86\x93\n// import { something } from \'myLibrary/development\';\n\n// In webpack production:\n// \xe2\x86\x93 \xe2\x86\x93 \xe2\x86\x93 \xe2\x86\x93 \xe2\x86\x93 \xe2\x86\x93 \xe2\x86\x93 \xe2\x86\x93\n// import { something } from \'myLibrary/production\';\n

\n\n

我的宏实现：

\n\n

import { createMacro } from \'babel-plugin-macros\';\n\nfunction macro({ references, state, babel }) {\n  state.file.path.node.body.forEach(node => {\n    if (node.type === \'ImportDeclaration\') {\n      if (node.source.value.includes(\'myLibrary/macro\')) {\n        if (process.env.NODE_ENV === \'production\') {\n          node.source.value = \'myLibrary/module/production\';\n        } else {\n          node.source.value = \'myLibrary/module/development\';\n        }\n      }\n    }\n  });\n\n  return { keepImports: true };\n}\n\nexport default createMacro(macro);\n\n

\n