DOTENV 플로우 웹팩 플러그인

블로그

dotenv-flow-webpack

안전한 웹팩 플러그인 .env, .env.development, .env.test, .env.production 등에 정의된 process.env.*를 통해 환경 변수에 액세스할 수 있는 기능을 제공합니다. 로 구축된 웹 애플리케이션 내의 파일 웹팩 .

구성 저장 환경 변수 코드에서 분리하고 다음과 같은 환경별로 그룹화 개발 , 시험 그리고 생산 Twelve-Factor App 방법론을 기반으로 합니다.

dotenv-flow 지원, dotenv-webpack에서 영감

미오타 구입처

설치

NPM 사용:

$ npm install dotenv-flow-webpack --save-dev

원사 사용:

$ yarn add dotenv-flow-webpack --dev

설명

기술적으로 플러그인은 webpack.config.js 파일에서 구성할 수 있는 기능을 제공하는 dotenv-flow API를 래핑합니다.

플러그인은 안전한 빌드 프로세스에서 process.env.* 코드 항목을 대체하는 전략, 따라서 코드에서 사용되는 환경 변수만 노출합니다. .

사용 예

프로젝트에 다음 파일이 있다고 가정해 보겠습니다.

# .env DATABASE_HOST=127.0.0.1 DATABASE_PORT=27017 DATABASE_USER=default DATABASE_PASS= DATABASE_NAME=my_app SERVICE_URL=/api/v1 # .env.development DATABASE_NAME=my_app_dev SERVICE_URL=http://localhost:3000/api/v1 # .env.test SERVICE_URL=https://localhost:3001/api/v1 # .env.production DATABASE_HOST=10.0.0.32 DATABASE_PORT=27017 DATABASE_USER=devops DATABASE_PASS=1qa2ws3ed4rf5tg6yh DATABASE_NAME=application_storage SERVICE_URL=https://myapp.com/api/v1 // webpack.config.js const DotenvFlow = require('dotenv-flow-webpack'); module.exports = { // ... plugins: [ new DotenvFlow() ], // ... }; // file1.js if (process.env.NODE_ENV !== 'production') { console.log(`Running in the '${process.env.NODE_ENV}' mode.`); } else { console.log('We are in production!'); } const USERS_ENDPOINT = process.env.SERVICE_URL + '/users'; console.log('USERS_ENDPOINT:', USERS_ENDPOINT);

따라서 NODE_ENV=development로 앱을 빌드하면 결과 번들에 다음과 같은 내용이 포함됩니다.

// file1.js if (true) { console.log('Running in the '.concat('development', ' mode.')); } else {} const USERS_ENDPOINT = 'http://localhost:3000/api/v1' + '/users'; console.log('USERS_ENDPOINT:', USERS_ENDPOINT);

또는 NODE_ENV=production으로 앱을 빌드하는 경우 출력은 다음과 같습니다.

// file1.js if (false) {} else { console.log('We are in production!'); } const USERS_ENDPOINT = 'https://myapp.com/api/v1' + '/users'; console.log('USERS_ENDPOINT:', USERS_ENDPOINT);

그리고 모든 최적화 절차가 끝나면 다음까지 압축됩니다.

console.log('We are in production!'); console.log('USERS_ENDPOINT:', 'https://myapp.com/api/v1/users');

DATABASE_(HOST/PORT/USER/PASSWORD/NAME) 값이 ~ 아니다 코드의 어느 곳에서도 참조되지 않는 동안 결과 번들에 있어야 합니다.

구성

dotenv-flow의 래퍼로, dotenv-flow-webpack 아래에 설명된 자체로 확장하는 동일한 구성 옵션이 있습니다.

options.node_env

유형: 문자열

기본값: process.env.NODE_ENV

자바 스크립트 뱀 게임 튜토리얼

기본적으로 플러그인은 NODE_ENV 환경 변수를 참조하여 사용할 환경을 감지합니다. node_env 옵션을 사용하면 모듈이 process.env.NODE_ENV와 독립적으로 사용자 정의 환경 값을 사용하도록 강제할 수 있습니다.

module.exports = (env, argv) => { // ... config.plugins.push(new DotenvFlow({ node_env: env.production ? 'production' : 'development' })); // ... };

options.default_node_env

유형: 문자열

기본: 찾으시는 주소가 없습니다

NODE_ENV 환경 변수가 설정되지 않은 경우 모듈은 NODE_ENV 관련 파일을 전혀 로드/파싱하지 않습니다. 따라서 '개발'을 기본 환경으로 사용하는 것이 좋습니다.

new DotenvFlow({ default_node_env: 'development' })

옵션.경로

유형: 문자열

기본값: process.cwd() (현재 작업 디렉토리)

경로 초기화 옵션을 사용하면 .env* 파일 디렉토리에 대한 경로를 지정할 수 있습니다.

new DotenvFlow({ path: '/path/to/env-files-dir' })

옵션이 제공되지 않으면 현재 작업 디렉토리가 사용됩니다.

옵션.인코딩

유형: 문자열

기본값: 'utf8'

환경 변수가 포함된 파일의 인코딩을 지정할 수 있습니다.

new DotenvFlow({ encoding: 'base64' })

options.system_vars

유형: 부울

기본값: 거짓

true인 경우 사전 정의된 모든 process.env.* 변수도 로드됩니다. dotenv-flow의 사양에 따라 사전 정의된 모든 시스템 환경 변수는 정의된 .env* 파일보다 높은 우선 순위를 갖습니다.

new DotenvFlow({ system_vars: true })

options.silent

유형: 부울

기본값: 거짓

모든 오류 및 경고를 표시하지 않으려면 true로 설정하십시오.

추가 정보

.env* 파일 개념에 대한 자세한 내용은 dotenv-flow 설명서를 참조하십시오.

roku.com\링크

관련 섹션 목록은 다음과 같습니다.

  • NODE_ENV 관련 .env* 파일
  • 버전 관리 중인 파일
  • 변수 덮어쓰기/우선순위

기여

마음껏 뛰어보세요! 이슈를 열거나 PR을 제출하십시오.

테스트 실행

NPM 사용:

$ npm test

원사 사용:

$ yarn test

특허

MIT 라이선스 © 2019-2020 Dan Kerimdzhanov

#dotenv #웹팩

github.com

DOTENV 플로우 웹팩 플러그인

코드와 별도의 환경 변수에 구성을 저장하고 개발, 테스트 및 프로덕션과 같은 환경별로 그룹화