`require ('dotenv'). config ()` не работает при сборке webpack - PullRequest
1 голос
/ 29 октября 2019

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

Я использую этот файл env.js для настройки своих переменных среды:

const NODE_ENV = process.env.NODE_ENV
require('dotenv').config()

switch (NODE_ENV) {
  case 'development':
    process.env.REACT_API_URL = process.env.DEV_API_URL
    process.env.REACT_BUILD_PATH = process.env.DEV_BUILD_PATH
    process.env.REACT_BUILD_MODE = 'development'
    break
  case 'production':
    process.env.REACT_API_URL = process.env.PROD_API_URL
    process.env.REACT_BUILD_PATH = process.env.PROD_BUILD_PATH
    process.env.REACT_BUILD_MODE = 'production'
    break
  default:
    throw new Error('NODE_ENV is not a valid value: should be \'development\' or \'production\' ')
    break
}

const REACT = /^REACT_/i
const raw = Object.keys(process.env)
  .filter(key => REACT.test(key))
  .reduce(
    (env, key) => {
      env[key] = process.env[key]
      return env
    },
    {

    }
  )
const stringified = {
  'process.env': Object.keys(raw).reduce((env, key) => {
    env[key] = JSON.stringify(raw[key])
    return env
  }, {})
}

module.exports = { raw, stringified }

Я скопировал и изменил некоторые из них из скриптов CRA. Таким образом, используя этот код с предоставленным файлом .env, если я запускаю узел REPL как NODE_ENV=development node и запускаю require('./env') с этим файлом, я могу получить такой результат:

// .env
DEV_API_URL=http://localhost:4000
DEV_BUILD_PATH=../../ssr/build
{ raw:
   { REACT_API_URL: 'http://localhost:4000',
     REACT_BUILD_PATH: '../../ssr/build',
     REACT_BUILD_MODE: 'development' },
  stringified:
   { 'process.env':
      { REACT_API_URL: '"http://localhost:4000"',
        REACT_BUILD_PATH: '"../../ssr/build"',
        REACT_BUILD_MODE: '"development"' } } }

При этом я ожидал увидеть тот же результат от env.js, чтобы использовать его при сборке пакета React с Webpack. Но результат был не таким, как я думал. Файл webpack.config.js (необходимая версия) выглядит следующим образом:

const path = require('path')
const webpack = require('webpack')

const env = require('./env')

module.exports = {
  entry: ["core-js/stable", "regenerator-runtime/runtime", "./src/index.jsx"],
  output: {

  // ...
  plugins: [
    new webpack.DefinePlugin(env.stringified)
  ]
}

В приведенном выше коде я импортировал объект env.js, чтобы использовать его как пользовательский process.env. Но внутри process.env все было не так, как я хотел:

// if I do `console.log(env)`:
{ raw:
   { REACT_API_URL: 'undefined',
     REACT_BUILD_PATH: 'undefined',
     REACT_BUILD_MODE: 'development' },
  stringified:
   { 'process.env':
      { REACT_API_URL: '"undefined"',
        REACT_BUILD_PATH: '"undefined"',
        REACT_BUILD_MODE: '"development"' } } }

Дело в том, что require('dotenv').config() в env.js вообще не вызывалось, поэтому любые переменные, использующие process.env дляинициализация не имеет никакого значения в них. Это правильное действие? Что мне делать, если я хочу достичь того, чего хотел?

...