從angular-cli創建的environment.ts文件中訪問process.env

我有一個angular-cli應用程序（角度版本4.0.0）。我希望能夠在由cli創建的environment.ts文件中訪問我的環境變量。從angular-cli創建的environment.ts文件中訪問process.env

例子：

export SOME_VARIABLE=exampleValue

當我建立我的角度應用程序我想「exampleValue」在SOME_VARIABLE領域進行填充。

// environment.ts 

export const environment = { 
    production: false, 
    SOME_VARIABLE: process.env.SOME_VARIABLE 
};

不幸的是，process.env文件無法在此文件中使用。我怎樣才能訪問它？

來源

2017-04-19 Blake

如果你找不到任何內置的方式，你可能需要[彈出]（https://github.com/angular/angular-cli/wiki/eject）並配置webpack [DefinePlugin]（https： //webpack.js.org/plugins/define-plugin/）。 –

謝謝！我不知道彈出 – Blake

這裏有一些解決方法：https：//github.com/angular/angular-cli/issues/4318 – Kildareflare

解決此問題的一種方法是創建一個代替佔位符的節點腳本。

這可以用npm的replace-in-file來完成。

一個解決方案可以是這樣的：

NPM安裝替換，在文件--save-dev的

創建板架

export const environment = { 
    production: true, 
    version: '{BUILD_VERSION}' 
}

創建節點腳本以替換佔位符（根文件夾中的replace.build.js）

var replace = require('replace-in-file'); 
var buildVersion = process.env.BUILD_NUMBER; 
const options = { 
    files: 'environments/environment.ts', 
    from: /{BUILD_VERSION}/g, 
    to: buildVersion, 
    allowEmptyPaths: false, 
}; 

try { 
    let changedFiles = replace.sync(options); 
    console.log('Build version set: ' + buildVersion); 
} 
catch (error) { 
    console.error('Error occurred:', error); 
}

在您的構建過程f.e.中執行此節點腳本。在一飲而盡

gulp.task('updateVersion', function (done) { 
    exec('node ./replace.build.js', function (err, stdout, stderr) { 
    console.log(stdout); 
    console.log(stderr); 
    done(); 
    }); 
});

現在你可以在你的應用程序中使用environment.version。

來源

2017-12-08 20:22:32 Juri

從angular-cli創建的environment.ts文件中訪問process.env

回答

相關問題