Angular Webpack 앱에서 환경 종속 변수를 전달하는 방법은 무엇입니까?

Webpack에서 환경 종속 변수 전달

Angular 앱을 Gulp에서 Webpack으로 변환하면 NODE_ENV를 기반으로 하는 HTML 페이지 변수를 대체해야 하는 과제가 발생합니다. . Webpack을 사용하여 이를 달성하는 몇 가지 효과적인 방법은 다음과 같습니다.

1. DefinePlugin

이 플러그인을 사용하면 일치하는 변수를 제공된 문자열로 대체할 수 있습니다:

new webpack.DefinePlugin({
    'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development')
}),

2. EnvironmentPlugin

DefinePlugin을 내부적으로 활용하는 이 플러그인은 환경 값을 코드에 매핑합니다:

new webpack.EnvironmentPlugin(['NODE_ENV'])

3. 별칭

별칭이 지정된 모듈을 생성하면 소비자 모듈을 통해 구성에 액세스할 수 있습니다.

// Consumer side
var config = require('config');

// Configuration module
resolve: {
    alias: {
        config: path.join(__dirname, 'config', process.env.NODE_ENV)
    }
}

NODE_ENV에 따라 구성을 내보내는 모듈에 매핑되므로 애플리케이션에서 환경 종속 변수에 액세스합니다.

위 내용은 Angular Webpack 앱에서 환경 종속 변수를 전달하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!