Dotenv не получает значение в виде строки

Question

Я установил dotenv для установки переменных окружения для разработки и производства, одна из них - ROOT_APIмой файл env выглядит так

NODE_ENV=dev
ROOT_API=http://localhost/project/public/
PORT=8000

Я установил свою конфигурацию запроса API в Axios и следовал инструкциям репозитория Dotenv, как это

require('dotenv').config({path: `${__dirname}/../.env`})
//I asume this is right as the value get returned 
//but there does not say that i have to configure anything else
export const http = axios.create({
  baseURL: process.env.ROOT_API + 'api/',
  headers: {
    'Content-Type': 'application/json',
    'Accept': 'application/json',
    'Authorization': tokenType + ' ' + token
  }
})

Я ожидаю что process.env.ROOT_API вернуть значение в виде строки, но в консоли я вижу ошибку Uncaught SyntaxError: Unexpected token : когда я вижу, где проблема, значения отображаются как

var http = __WEBPACK_IMPORTED_MODULE_5_axios___default.a.create({
  baseURL: http://localhost/project/public/ + 'api/',
  headers: {
    'Content-Type': 'application/json',
    'Accept': 'application/json',
    'Authorization': tokenType + ' ' + token
  }
});

я пытался

• используя разные цитаты в .env файл
• преобразовать process.env.ROOT_API строка или регистрация типа значения, но получить ошибку SyntaxError: missing ) after argument list так как значение выглядит как обычный текст в js.
• используя шаблоны литералов, как это ${process.env.ROOT_API}; показать в console > sources'' + http://localhost/project/public/; // я не знаю, как отобразить `кавычки, отображать его как код извините.

Я делаю console.log чтобы увидеть, что process.env есть в консоли, и это то, что он показывает

   ...
   PWD: 'C:/xampp/htdocs/project',
   ROOT_API: 'http://localhost/erp-api/public/',
   SESSIONNAME: 'Console',
   ...

Как я могу это исправить? я не понимаю, почему это не получить значение в виде строки?

Answer 1

У меня была такая же проблема, и вот что я сделал:

Если вы используете webpack.DefinePlugin() использовать webpack.EnvironmentPlugin() вместо этого и получите dotenv.parsed ключи там с Object.keys() как это:

// webpack.config.js

const webpack = require('webpack')
const dotenv = require('dotenv').config()

module.exports = {

//...other configs

  plugins: [
     new webpack.EnvironmentPlugin(Object.keys(dotenv.parsed || {})),
  ]
]

Answer 2

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

Если

baseURL: process.env.ROOT_API + 'api/'

переводится как:

baseURL: http://localhost/project/public/ + 'api/', это означает, что есть проблема с вашей транспиляцией. Вам следует проверить наличие проблемы (или обновить вопрос, добавив дополнительную информацию о конфигурации и использовании вашего веб-пакета)

Answer 3

Немного поздно... но следует моему решению.

  ...
  plugins: [
    new webpack.DefinePlugin({
    'process.env': JSON.stringify(dotenv.parsed)
  })

Преобразует все в строку, больше нет случайных ошибок;)

Answer 4

Установите этот пакет как зависимость для разработки ( https://www.npmjs.com/package/dotenv-webpack):

npm install  --dev  dotenv-webpack

или же

yarn add -D dotenv-webpack

После этого просто добавьте этот код в ваш файл веб-пакета:

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

        module.exports = {
          ...
          plugins: [
            new Dotenv()
          ]
          ...
        };

Ссылка Ссылка: https://www.npmjs.com/package/dotenv-webpack