根据环境变量导入/导出

Question

对于clientSide应用程序，我想根据package.json中设置的环境变量选择特定的导入。

例如：`

if (process.env.IS_DEV)
    import { store } from '../../../index.js
 else
    import { store } from './index.js';

`

反正有这样做吗？ 我目前收到错误-

  

解析错误：“导入”和“导出”可能仅出现在顶层

Answer 1

如错误所述，import只能位于最高级别。

如果您使用诸如webpack或parcel之类的捆绑器，则可以改用require。

请注意：这两个实现都将在捆绑包内，并且仅执行其中一个。

Answer 2

如果您使用的是Web Pack 1，则可以使用Web Pack动态导入来启用此功能

$ npm install babel-plugin-dynamic-import-webpack --save-dev

然后是.babelrc

{
  "plugins": ["dynamic-import-webpack"]
}

https://github.com/airbnb/babel-plugin-dynamic-import-webpack

在较新版本的Web Pack中，您可以在没有Babel的情况下完成

https://webpack.js.org/api/module-methods/#dynamic-expressions-in-import

前面提到的另一种解决方案是使用require

但是我想在这里您可以用另一种方法来避免在捆绑结果中包含此文件，您可以在构建dist之前添加要运行的构建脚本，从而在将该文件完全捆绑到前端应用程序< / p>

Answer 3

也许最好检查存储文件中的List并根据当前环境导出不同的值