Есть ли способ горячей перезагрузки моей страницы Vue после изменения переменной среды в VueJS? - PullRequest
3 голосов
/ 07 мая 2020

Я хочу иметь разные режимы для своего приложения, поэтому я создал разные .env файлы для хранения переменных среды. Использование этих переменных работает нормально, единственная проблема заключается в том, что мне приходится перезапускать все приложение, когда я что-то меняю в файлах .env. Я попытался передать переменные среды на аутсорсинг в файл .json, чтобы заставить его работать с Hot Reload, но это не сработало.

Это мой .env файл:

NODE_ENV=development
VUE_APP_JSON_FILE=./m.json

My vue.config.js:

const webpack = require("webpack");

module.exports = {
  configureWebpack: {
    plugins: [
      new webpack.DefinePlugin({
        VUE_APP_JSON: JSON.stringify(require(process.env.VUE_APP_JSON_FILE))
      })
    ]
  }

Мой .json файл:

{
  "logo": {
    "picture": "test.jpg",
  }
}

Теперь я могу вызывать переменную внутри. json как VUE_APP_JSON.logo.picture. Как я уже сказал, все это работает, но изменение переменных в файле .env или. json не запускает горячую перезагрузку. Кто-нибудь знает, как этого добиться? Заранее спасибо.

1 Ответ

1 голос
/ 07 мая 2020

TL; DR;

Нет, вы не можете


по моему опыту вы не можете и никогда не сможете. поскольку файлы .env несколько кэшируются (я действительно не знаю, как они это называют), но после того, как вы скомпилировали свое приложение, вы никогда не сможете изменить .env, тогда ожидайте, что переменные файлов .env с горячей перезагрузкой статически используются в скомпилированном коде он сам, а не как переменная, поэтому при изменении файла .env вы ничего не меняли в коде или какой-либо переменной. вам действительно нужно перекомпилировать этот проект еще раз, чтобы обновить данные stati c, которые использует ваш скомпилированный код.


UPDATE ..

вы даже не можете сделать vue .config. js для горячей перезагрузки. когда вы меняете что-либо в этом файле, вам также действительно нужно перекомпилировать .. поскольку vue .config. js - это конфигурация для самого компилятора. webpack - это компилятор, а vue .config. js - это конфигурация.

...