Блог

 "vue": "^2.4.4"
  

Я определил свойства в main.js:

 Object.defineProperties(Vue.prototype, {
  baseURL: {
    value: process.env.API_ROOT,
    writable: false
  }
});
  

У меня есть другой файл js с именем version.js в src / common

 import Vue from "vue";
let app = new Vue({
  el: "#app",
})
console.log("---------------------version start---------------------")
console.log("prototype 1:", Vue.prototype)
console.log("baseURL 1:", Vue.prototype.baseURL)
console.log("---------------------version end---------------------")

console.log("---------------------app start---------------------")
console.log("prototype 2:", app)
console.log("baseURL 2:", app.baseURL)
console.log("---------------------app end---------------------")
  

Я не могу понять журнал консоли:
прототип 1 содержит baseUrl, но baseUrl 1 не определен.
прототип 2 не содержит baseUrl, а baseUrl 2 не определен.

Если я хочу получить baseUrl в version.js . что мне делать?

Первая проблема заключается в том, что только .env свойства с префиксом VUE_APP_ попадают в ваши связанные файлы.

Переменные среды

Обратите внимание, что только NODE_ENV , BASE_URL и переменные, начинающиеся с VUE_APP_ , будут статически встроены в пакет клиента с webpack.DefinePlugin .

Измените ваш .env файл на

 VUE_APP_API_ROOT=https://whatever/
  

Во-вторых, это именно то, для чего предназначены плагины Vue…

4. Добавьте несколько методов экземпляра Vue, присоединив их к Vue.prototype.

Вы можете создать свой собственный плагин очень просто, вот так

 // base-url-plugin.js
export default {
  install: Vue => {
    Object.defineProperty(Vue.prototype, "baseURL", {
      value: process.env.VUE_APP_API_ROOT ?? "https://some-default/",
      writable: false
    })
  }
}
  

 import Vue from "vue"
import baseUrlPlugin from "./path/to/base-url-plugin.js"

// install the plugin first
Vue.use(baseUrlPlugin)

// now create your root Vue instance
let app = new Vue({
  el: "#app",
})
  

Вам просто нужно убедиться, что ваш плагин установлен перед созданием корневого Vue экземпляра.