react env
3.1.0
Mengisi lingkungan Anda dari file .env saat run-time daripada membangun waktu .
.env . Paket ini menghasilkan file __ENV.js dari beberapa file .env yang berisi variabel lingkungan yang terdaftar putih yang memiliki awalan REACT_APP_ .
< script src =" /public/__ENV.js " /> Di browser, variabel Anda akan tersedia di window.__ENV.REACT_APP_FOO dan pada process.env.REACT_APP_FOO server.env.react_app_foo. Kami telah memasukkan fungsi pembantu untuk membuat pengambilan nilai lebih mudah:
# .env
REACT_APP_NEXT= " Next.js "
REACT_APP_CRA= " Create React App "
REACT_APP_NOT_SECRET_CODE= " 1234 "menjadi ...
import env from "@beam-australia/react-env" ;
export default ( props ) => (
< div >
< small >
Works in the browser: < b > { env ( "CRA" ) } </ b > .
</ small >
< small >
Also works for server side rendering: < b > { env ( "NEXT" ) } </ b > .
</ small >
< form >
< input type = "hidden" defaultValue = { env ( "NOT_SECRET_CODE" ) } />
</ form >
< small >
Entire safe environment:
< pre >
< code > { { JSON . stringify ( env ( ) ) } } </ code >
</ pre >
</ small >
</ div >
) ;Kami telah menerapkan beberapa default waras yang memiliki urutan prioritas berikut:
{path-to-file} // from the --path, -p argument.env.{key} // from the --env, -e argument.env.local.env Konfigurasi Anda tersedia di browser dan process.env di server. Kami sarankan Anda menambahkan .env.local ke .gitignore .
Kerangka kerja seperti berikutnya memungkinkan untuk beberapa default yang bagus seperti .env.local, .env.production, .env . Ini memiliki batasan di mana Anda mungkin ingin menjalankan aplikasi Anda di lingkungan yang berbeda seperti "pementasan, integrasi, QA" tetapi masih membangun aplikasi "produksi" dengan NODE_ENV=production . Dengan React-ENV ini mungkin:
# .env.staging
REACT_APP_API_HOST= " api.staging.com "
# .env.production
REACT_APP_API_HOST= " api.production.com "
# .env.qa
REACT_APP_API_HOST= " api.qa.com "
# .env.integration
REACT_APP_API_HOST= " api.integration.com "
# .env.local
REACT_APP_API_HOST= " api.example.dev "
# .env
REACT_APP_API_HOST= " localhost " Untuk pementasan Anda hanya akan mengatur APP_ENV=staging di mana Anda menjalankan aplikasi Anda:
{
...
"scripts": {
"start": "react-env --env APP_ENV -- next start" // where .env.${APP_ENV}
}
...
}
Jadi REACT_APP_API_HOST=api.staging.com di lingkungan pementasan Anda.
Harap diingat bahwa Anda harus memberikan nama variabel lingkungan ke
--env, bukan nilai dari itu.
- ✔ Penggunaan yang valid (macOS):
APP_ENV=staging react-env --env APP_ENV -- next start- Kesalahan Umum:
react-env --env staging -- next start
Anda juga dapat menentukan jalur ke file env tertentu:
{
...
"scripts": {
"start": "react-env --path config/.env.defaults -- next start"
}
...
}
Anda dapat menggunakan kombinasi apa pun dari dua argumen ini bersama dengan .env, .env.local untuk membangun konfigurasi runtime Anda.
Anda juga dapat menentukan awalan variabel lingkungan yang terdaftar putih:
{
...
"scripts": {
"start": "react-env --prefix NEXT_APP -- next start"
}
...
}
# .env
NEXT_APP_NEXT= " Next.js "
NEXT_APP_CRA= " Create React App "
NEXT_APP_NOT_SECRET_CODE= " 1234 " Anda perlu menambahkan variabel env REACT_ENV_PREFIX sebelum perintah jest jika Anda menggunakan env() selama pengujian Anda:
{
...
"scripts": {
"test": "REACT_ENV_PREFIX=NEXT_APP jest --maxWorkers=3"
}
...
}
Dimungkinkan untuk menggunakan paket ini sebagai skrip ENTRYPOINT di dalam DockerFile. Ini akan menghasilkan file konfigurasi __ENV.js Anda saat wadah memotret dan memungkinkan skrip package.json Anda tetap tidak berubah. Tentu saja node biner harus ada di wadah Anda.
FROM node:alpine
ENTRYPOINT yarn react-env --env APP_ENV
CMD yarn start$ react-env < args > -- < command ><command> Anda dapat meneruskan perintah, seperti file entri NodeJS ke alat CLI react-env . Misalnya react-scripts , next dev , next start
--env , -e (default: null) Tentukan nama variabel lingkungan yang ada, yang nilainya adalah nama lingkungan yang Anda inginkan, untuk membuat react-env parse lingkungan tertentu. Misalnya, Anda dapat mengatur APP_ENV=staging terlebih dahulu dan kemudian menerapkan --env APP_ENV flag. React-env akan memuat .env.staging, .env.local, .env dalam urutan itu dengan yang terakhir mengambil prioritas.
--path , -p (default: null) Tentukan file env tertentu untuk memuat misalnya react-env --path .env.testing akan memuat .env.testing, .env.local, .env dalam urutan itu dengan prioritas pengambilan yang terakhir. Kombinasi dari --env APP_ENV --path testing di mana APP_ENV=staging muatan .env.testing, .env.staging, .env.local, .env sebagai urutan prioritas.
--dest , -d (default: ./public) Ubah tujuan default untuk menghasilkan file __ENV.js .
--prefix (default: react_app) Ubah awalan default untuk variabel Env yang terdaftar putih. Sebagai contoh react-env --prefix CUSTOM_PREFIX akan variabel daftar putih seperti: CUSTOM_PREFIX_PUBLIC_KEY=my-public-key
--debug (default: false) Aktifkan debugging untuk reaksi-env. Ini akan mencatat variabel lingkungan browser yang dimuat ke dalam konsol Anda saat menjalankan react-env --debug
Sebagai perubahan yang signifikan, kami telah menjatuhkan kemampuan untuk menentukan file spesifik melalui argumen --env . Argumen ini sekarang menentukan file lingkungan yang harus diuraikan tergantung pada lingkungan yang sedang berjalan. Misalnya --env APP_ENV atau -e APP_ENV di mana APP_ENV=staging dibaca di .env.staging . Sangat umum bagi platform untuk memiliki staging, qa, integration yang masih dibangun dalam mode "produksi" dengan NODE_ENV=production . Ini memungkinkan untuk Usecase dan banyak lainnya.
-Anda masih dapat menentukan file melalui argumen --path, -p .
Kami juga telah menjatuhkan penambahan NODE_ENV secara default karena ini adalah risiko keamanan.
File sekarang bernama __ENV.js
Command depandand sekarang dalam format react-env <args> -- <command>
