Блог

Я подумал, что мог бы использовать ${process.env.apiservervariable} для своих вызовов api. Я добавил это в свой env.development

NEXT_PUBLIC_REACT_APP_API_SERVER=»http://localhost:8000 »

который работает для npm run dev. Но когда я собираю, я получаю ошибки, что я использую неполные или относительные пути. Я перешел на использование next.config.js файл и помещаем туда переменную вот так:

 module.exports = {
env: {
    apiServer: "http://localhost:8000",
    STRIPE_PUBLISHABLE: "pk_test_hash"
  },
}
 

Это работает, но я должен жестко запрограммировать его, чтобы изменить его в зависимости от сервера, который я хочу использовать. Есть ли способ иметь переменную, которая считывается из dev, когда я использую npm run dev, и другую, когда я запускаю npm run build? Я разрабатываю локально, а затем отправляю на github. Я использую производственный сервер и хочу иметь возможность строить на сервере с другой переменной для текущего сервера.

Вы были очень близки к своей первой идее.

В Next.js у вас могут быть отдельные файлы конфигурации для сред разработки и производства: создать .env.development и .env.production в корневом каталоге проекта. next dev загрузит файл разработки и next start рабочий файл. Вы должны включить свою API_SERVER переменную в оба файла с разными значениями и предоставить их стороне клиента путем предварительной настройки NEXT_PUBLIC_ . Таким образом, вы сможете получить доступ к нему в своем интерфейсе с process.env.NEXT_PUBLIC_API_SERVER помощью .

 // .env.development
NEXT_PUBLIC_API_SERVER=http://localhost:3000
 

 // .env.production
NEXT_PUBLIC_API_SERVER=https://google.com