在 Parceljs 中暴露环境？

Posted 2023-02-23

【中文标题】在 Parceljs 中暴露环境？

【英文标题】：Expose Environment in Parceljs?

【发布时间】：2018-06-09 03:27:42

【问题描述】：

我试图在使用Parcel.js 构建时公开一个变量，类似于Webpack DefinePlugin，但我还没有找到如何去做。

在开发中，我希望我的 API 主机与我的生产主机不同，所以：

//development:
API_URL="http://localhost:8900/"

//production:
API_URL="/"

目前 Parcel 支持 module.hot 开关，我可以滥用它，因为热模块重新加载仅在开发中启用，但如果有更好的方法来实现这一点会很好。

我还可以检查window.location.hostname 是否为localhost，但这是一种解决方法。

【参考方案1】：

对于仍在寻求答案的人：

您可以使用 Parcel.js 的 .env 文件支持（通过 dotenv 包）added in 1.5.0 (2018-01-23)。

无需额外配置。只需将您的 .env 文件用适当的NODE_ENV（生产、开发等）分隔，您就可以通过process.env.VARIABLE_NAME 访问变量。在你的情况下，你可以这样做：

.env.development

API_URL=http://localhost:8900/

.env.production

API_URL=/

然后根据需要在代码中调用process.env.API_URL（无需进一步导入）来使用它。

【讨论】：

完美运行，几乎太容易了。就我而言，我在构建我的代码的npm 脚本上设置了环境变量，例如："build": "NODE_ENV=production parcel build

抱歉，我不太明白。 .env.development 和 .env.production 应该在哪里？

parceljs.org/env.html 它说 .env 文件应该与 package.json 文件在同一个目录下。 ;)

它们是否包含在捆绑包中？如何在 JS 控制台中访问/设置它们？