Я пытаюсь использовать переменную среды в своем компоненте. Но сначала он работает, когда я использую переменную, но затем выдает ошибку.

< Сильный > Component.vue

website: 'testing-hard-reality'

Код работает абсолютно нормально, когда он жестко запрограммирован, как показано выше. Если вместо жесткого кода используется переменная среды, я получаю сообщение об ошибке

.env.local

VUE_APP_WEB_SITE: 'testing-hard-reality'

В компоненте переменная используется как:

website: process.env.VUE_APP_WEB_SITE

В моей консоли я получаю сообщение об ошибке:

[Предупреждение Vue]: Ошибка в обработчике v-on: «Ошибка: имя веб-сайта не задано»

Скажите, пожалуйста, что мне делать?

-1
app_er 18 Янв 2021 в 14:54

2 ответа

Лучший ответ

Создайте на том же уровне папки src файл

.env.development.local используется для локальной работы

.env.production.local используется для производства

Добавьте в файл вашу переменную env

VUE_APP_MY_VARIABLE_NAME = my-value-here

Часть VUE_APP_* важна, потому что все переменные env в проекте vue должны начинаться с этого префикса.

Теперь, чтобы получить доступ к этому значению, выполните:

process.env.VUE_APP_MY_VARIABLE_NAME

ВАЖНО ШАГ

Каждый раз, когда вы изменяете файлы .env, вы должны останавливать сервер и запускать его снова, чтобы получить изменения env.

1
app_er 18 Янв 2021 в 13:58

Я предполагаю, что вы используете vue-cli для создания своего проекта vue. В документации vue-cli я обнаружил, что грамматика env.local будет

VUE_APP_WEB_SITE=testing-hard-reality

Не ваша демонстрация: VUE_APP_WEB_SITE: 'testing-hard-reality'

Ref: https://cli.vuejs.org/guide/ mode-and-env.html # переменные-среды

1
iulo 18 Янв 2021 в 12:02