Разместил это в репозитории Svelte также:
Я только что сделал свое первое приложение Svelte на выходных, и мне очень понравилось. Мне любопытна одна вещь, которую я не смог выяснить с приличным количеством исследований, - это то, можно ли / как можно передать env var времени выполнения или аналогичный клиентскому скрипту, чтобы он был доступен в пакете / браузер. Это, вероятно, не считается «лучшей практикой», поэтому, возможно, я здесь один, но, например, в Pug вы можете сделать что-то вроде следующего (например, из обработчика маршрута Hapi.js):
const context = {
foo: bar,
baz: ''
}
return h.view('index', context)
Затем эти переменные становятся доступными в контексте Pug.
В моем игрушечном приложении я хотел сделать возможным передавать ключ api во время запуска сервера (либо из .env, либо из интерфейса командной строки) и вводить его с сервера Express следующим образом:
app.use(express.static(`${__dirname}/public`))
и пусть эта переменная будет доступна в клиентском скрипте. Опять же, вероятно, не рекомендуется внедрять ключи api в клиентские скрипты и делать оттуда вызовы, но возможна ли такая передача переменных в Svelte?
Похоже, это должно быть возможно с использованием rollup-plugin-inject или rollup-plugin-replace, но я не мог понять, как это сделать. Это определенно не критика фреймворка, но, возможно, раздел о работе с env vars был бы полезным дополнением к документации Svelte. Спасибо!
Обычно это то, что вы делаете в своей конфигурации сборки. Исходя из тега rollupjs, я предполагаю, что вы это используете - вы можете использовать свернуть-плагин-заменить для вставки нужного вам контента:
// rollup.config.js
import replace from 'rollup-plugin-replace';
import svelte from 'rollup-plugin-svelte';
export default {
input: 'src/main.js',
output: {
file: 'public/bundle.js',
format: 'iife'
},
plugins: [
svelte(),
replace({
// you're right, you shouldn't be injecting this
// into a client script :)
'API_KEY': process.env.API_KEY
})
]
};