Почему не получается получить доступ к переменной окружения?

Question

[Islam Ibakaev]

поднял проект коммандой vue init webpack project-name
разобрался как добавить pug и stylus
хочу настроить переменные окружения: использовал плагин, создал файл .env, добавил переменную API_SECRET_KEY=efb9erfdf6fd9vfd98vd8ssv(значение переменной вымышленно для примера) и отправил .env в .gitignore

подкорректировал /config/index.js
внизу то, что я добавил к шаблонной конфигурации

const path = require('path')
const Dotenv = require('dotenv-webpack')

module.exports = {
...
...
...
  module: {
    rules: [
      {
        test: /.vue$/,
        loader: 'vue-loader',
        options: {
          loaders: {
            css: 'stylus-loader'
          }
        }
      }
    ]
  },
  plugins: [
    new Dotenv({ path: path.join(process.cwd(), '.env') })
  ]
}

в App.vueпытаюсь вывести в консоль переменную process.env.API_SECRET_KEY, но выдаёт undefined

В чём проблема? Всё сделал по инструкции. Как вы достаёте переменные из .env в коде компонента?

Comments

[Islam Ibakaev]

ок я открыл issue, если кому интересно

Answer 1

[Роман]

С webpack 2 решил вопрос так:
С помощью DefinePlugin определил переменные в глобальной области видимости:

const GLOBALS = {
  'process.env': {
    'NODE_ENV': JSON.stringify('development')
  },  
  API_SECRET_KEY: JSON.stringify('efb9erfdf6fd9vfd98vd8ssv'),
};

module.exports = {
  plugins: [  
      new webpack.DefinePlugin(GLOBALS)
  ],

 externals: {
    API_SECRET_KEY: 'API_SECRET_KEY'
   },
}

После этого API_SECRET_KEY стала доступна в браузере. Пока не прописал в externals - была ситуация, похожа на вашу

Comments

[Islam Ibakaev]

ты чё прикалываешься? мы не хотим палить ключ (:

вообщем мне ответили на issue, посоветовав добавить

plugins: [
    new Dotenv({ path: path.join(process.cwd(), '.env') })
  ]

в /build/webpack.base.conf.js

p.s. я потом подумал, в приницпе можно не заморачиваться с .env, а просто создать файл типа keys.js, добавить туда ключ, а сам файл кинуть в .gitignore

[Роман]

ты чё прикалываешься?

я написал, чтобы вам понятнее было на простом примере )