时间戳

首页 > 解决方案 > svelte + rollup 中的环境变量

javascript - svelte + rollup 中的环境变量

问题描述

我正在寻找一种简单的方法来设置环境。IE 如果我可以运行npm run dev:local并npm run dev:staging加载不同的环境文件，这些文件可以在运行时通过process.env. 了解它已编译，因此我可能必须以不同的方式访问变量。我直接从 sveltejs/template 使用带有汇总的 svelte。它应该很简单，但我看不出有什么办法。这很麻烦，但可以用 webpack 来做。有没有一种简单的方法可以做到这一点？

标签： javascriptenvironmentsvelterollup

解决方案

您可以使用@rollup/plugin-replace在编译后的代码中注入构建时间常量。

像这样的东西：

rollup.config.js

import replace from '@rollup/plugin-replace'
...

const production = !process.env.ROLLUP_WATCH

export default {
  ...
  plugins: [
    replace({
      'process.env': production ? '"production"' : '"dev"',
    }),
    ...
  ]
}

注意值的双引号：'"production"'. 该插件按代码中的原样注入字符串，因此，如果您想要一个字符串，则需要引号中的引号。

此外，正如插件文档中所提到的，它应该放在插件数组的开头，以启用优化，例如通过它后面的其他插件抖掉死代码。

推荐阅读