AngularJS中的configuration文件

什么是创buildconfiguration文件(类似于.net中的webconfiguration)的最佳方式,用于存储url以及在应用程序部署期间可能会有所不同的其他常量?

使用.constant()方法:

 angular.module('app').constant('MONGOLAB_CONFIG', { baseUrl: '/databases/', dbName: 'ascrum' }); 

像这个例子一样 。

然后你可以在需要常量的地方注入它。

你可以有不同的文件定义不同的常量用于开发或生产,然后使用像Grunt这样的工具根据环境使用这个或那个文件。

假设你有这样的文件夹结构:

 |-js/ | |-app.js | |-anotherfile.js | |-... | |-env/ | |-dev.js | |-prod.js | |-index.html 

dev.jsprod.js使用不同的值定义相同的.constant()服务。 然后你可以得到适当的文件连接到一个像这样的gruntFile:

 grunt.registerTask('default', ['concat']); grunt.initConfig({ env : process.env.NODE_ENV, src: { javascript: ['js/*.js'], config: ['env/<%= env %>.js'] }, concat: { javascript: { src:['<%= src.config %>', '<%= src.javascript %>'], dest:'myapp.js' } } }); 

通过运行grunt你会得到一个myapp.js文件,其中包含好的常量。

编辑 :与Gulp你可以这样做:

 var paths = [ 'env/' + process.env.NODE_ENV + '.js', 'js/**/*.js', ]; var stream = gulp.src(paths) .pipe(plugins.concat('main.js')) .pipe(gulp.dest('/output')); 

恕我直言,我不喜欢用任务跑步者处理configuration文件。 因为每次需要不同的configuration时,您都需要重新构build整个应用程序,以便更改一行或两行。

使用angular的.config是一件好事,我会做一些事情(从第一个答案的例子中借用)

 angular.module('app').constant('MONGOLAB_CONFIG', { baseUrl: '/databases/', dbName: 'ascrum' }); 

让我们把它命名为app.config.js

这将在这样的缩小脚本之后的.html中链接

 <script src="js/app-38e2ba1168.js"></script> //the application's minified script <script src="/app.config.js"></script> 

你可以编辑app.config.js文件,而不用重新运行任何任务。 因此,您可以在不同的机器/环境下拥有不同的app.config.js文件,而无需重复构build应用程序

在盒子外面思考,你并不是真的想使用.constant,因为它与应用程序绑定在一起。 使用位于应用程序之外的configuration,您可以更好地控制envconfiguration。 我已经提供了一个链接,下面解释在angular度构build本身configuration的陷阱。

 (function hydrateConfiguration() { "use strict"; var xhr = new XMLHttpRequest(); xhr.open("get", "conf.json", window); xhr.onload = function () { var status = xhr.status; if (status === 200) { if (xhr.responseText) { var response = JSON.parse(xhr.responseText); window.ss_conf = response; } } else { console.error("messages: Could not load confguration -> ERROR ->", status); } }; xhr.send() )()); 

只是一个简单的例子,其中一个外部configuration文件控制应用程序的状态,并注入外面的值,而不是内部。

https://www.jvandemo.com/how-to-configure-your-angularjs-application-using-environment-variables/