#javascript #vue.js #vuejs2 #environment-variables #frontend
Вопрос:
Как мы можем убедиться, что перед созданием приложения vue js заданы все значения переменных среды, указанные в .env.пример ?
Комментарии:
1. Это зависит от того, с помощью чего вы создаете приложение. Пожалуйста, также опишите процесс сборки.. Я предполагаю, что Vue CLI?
2. Да, с Vue CLI @PeterKrebs
Ответ №1:
Простым решением было бы написать сценарий оболочки, который импортирует .env
и проверяет переменные среды.
Вы можете отредактировать package.json
и добавить этот скрипт (давайте назовем его check-env.sh
scripts
разделом:
{
"scripts": {
"serve": "./check-env.sh amp;amp; vue-cli-service serve",
"build": "./check-env.sh amp;amp; vue-cli-service build",
"dev": "./check-env.sh amp;amp; vue-cli-service build --mode development",
"watch-dev": "./check-env.sh amp;amp; vue-cli-service build --watch --mode development",
"watch": "./check-env.sh amp;amp; vue-cli-service build --watch --mode production",
"lint": "./check-env.sh amp;amp; vue-cli-service lint"
},
}
Это можно было бы сделать более элегантным, например, с помощью плагина Webpack, но он дает вам возможность включать и выключать его для вышеуказанных сценариев.
// vue.config.js
// Import your script along the other imports in this file...
module.exports = {
configureWebpack: config => {
// Call the check here and throw an exception. This should work.
if (process.env.NODE_ENV === 'production') {
// mutate config for production...
} else {
// mutate for development...
}
}
}