如何管理不同环境的配置变量/常量?
这可能是一个示例:
我的其余API可以访问localhost:7080/myapi/,但是在Git版本控制下使用相同代码工作的朋友在Tomcat上部署了该API localhost:8099/hisapi/。
localhost:7080/myapi/
localhost:8099/hisapi/
假设我们有这样的东西:
angular .module('app', ['ngResource']) .constant('API_END_POINT','<local_end_point>') .factory('User', function($resource, API_END_POINT) { return $resource(API_END_POINT + 'user'); });
如何根据环境动态注入API端点的正确值?
在PHP中,我通常使用config.username.xml文件来执行此类操作,将基本配置文件(config.xml)与用户名称识别的本地环境配置文件合并。但是我不知道如何在JavaScript中管理这种事情?
config.username.xml
我现在还不算很晚,但是如果您使用的是Grunt,那么我会取得很大的成功grunt-ng-constant。
grunt-ng-constant
ngconstant在我的配置部分Gruntfile.js看起来像
ngconstant
Gruntfile.js
ngconstant: { options: { name: 'config', wrap: '"use strict";\n\n{%= __ngModule %}', space: ' ' }, development: { options: { dest: '<%= yeoman.app %>/scripts/config.js' }, constants: { ENV: 'development' } }, production: { options: { dest: '<%= yeoman.dist %>/scripts/config.js' }, constants: { ENV: 'production' } } }
使用的任务ngconstant看起来像
grunt.registerTask('server', function (target) { if (target === 'dist') { return grunt.task.run([ 'build', 'open', 'connect:dist:keepalive' ]); } grunt.task.run([ 'clean:server', 'ngconstant:development', 'concurrent:server', 'connect:livereload', 'open', 'watch' ]); }); grunt.registerTask('build', [ 'clean:dist', 'ngconstant:production', 'useminPrepare', 'concurrent:dist', 'concat', 'copy', 'cdnify', 'ngmin', 'cssmin', 'uglify', 'rev', 'usemin' ]);
所以运行grunt server会产生一个config.js文件app/scripts/,看起来像
grunt server
config.js
app/scripts/
"use strict"; angular.module("config", []).constant("ENV", "development");
最后,我声明对任何需要它的模块的依赖:
// the 'config' dependency is generated via grunt var app = angular.module('myApp', [ 'config' ]);
现在,我的常量可以在需要的地方进行依赖注入。例如,
app.controller('MyController', ['ENV', function( ENV ) { if( ENV === 'production' ) { ... } }]);