svelte + rollup 中的环境变量

Question

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

Answer 1

您可以使用 @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"'。该插件按照代码中的原样注入字符串，因此，如果您想要一个字符串，则需要在引号中加上引号。

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

svelte + rollup 中的环境变量

Environment variables in svelte + rollup

javascript

environment

svelte

rollup