AngularJS中的配置文件

Iva*_*lek 70 angularjs

创建配置文件(在.net中的Web配置之类的东西),存储URL以及在应用程序部署期间可能会有所不同的其他常量的最佳方法是什么?

max*_*dec 85

使用.constant()方法:

angular.module('app').constant('MONGOLAB_CONFIG', {
  baseUrl: '/databases/',
  dbName: 'ascrum'
});
Run Code Online (Sandbox Code Playgroud)

就像在这个例子中.

然后你可以将它注入你需要常量的地方.

您可以使用不同的文件定义开发或生产的不同常量,然后使用Grunt等工具根据环境使用此文件或该文件.

我们假设你有这种文件夹结构:

|-js/
|  |-app.js
|  |-anotherfile.js
|  |-...
|
|-env/
|  |-dev.js
|  |-prod.js
|
|-index.html
Run Code Online (Sandbox Code Playgroud)

dev.js并使用不同的值prod.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'
    }
  }
});
Run Code Online (Sandbox Code Playgroud)

通过运行,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'));
Run Code Online (Sandbox Code Playgroud)

  • 这可能是唯一的方法,但它最终有一个大问题 - 如何为不同的环境保留不同的常量值(例如:dev和生产环境的baseUrl).看看这个,可能会有所帮助:http://stackoverflow.com/questions/16339595/angular-js-configuration-for-different-enviroments (5认同)
  • 另一种选择是使用您的版本控制系统.忽略配置文件并添加包含空值,默认值或示例值的模板文件.当有人克隆回购时,他们必须根据模板创建实际文件.当他们推送到repo时,将不会上传自定义配置文件. (3认同)

Lou*_*eda 9

恕我直言,我不喜欢用任务运行器处理配置文件.因为每次需要不同的配置时,您需要重建整个应用程序,以便更改一行或两行.

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

angular.module('app').constant('MONGOLAB_CONFIG', {
  baseUrl: '/databases/',
  dbName: 'ascrum'
});
Run Code Online (Sandbox Code Playgroud)

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

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

<script src="js/app-38e2ba1168.js"></script> //the application's minified script
<script src="/app.config.js"></script>
Run Code Online (Sandbox Code Playgroud)

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