javascript - AngularJS 通过组合 javascript 文件减少 HTTP 请求

Question

使用 angularJS 很棒。虽然我看到一个问题，因为我有以下文件:

• 应用程序.js
• controllers.js
• 过滤器.js
• 指令.js
• 服务.js

与实际的 AngularJS 库文件以及可能的 jQuery 一起分配给服务器的 http 请求。

有没有办法将所有这些组合在一起用于生产环境？更重要的是，是否有特定的 AngularJS 推荐方法来执行此操作？

Answer 1

Grunt.js 项目能够执行任务命令，例如我上面描述的缩小和串联。对这些任务提供最广泛支持的两个 grunt.js 插件是:

• 丑化(缩小)
• Concat(文件串联)

下面是一个示例任务脚本:

module.exports = function(grunt) {

  grunt.initConfig({
    concat: {
      options: {
        separator: ';'
      },
      dist: {
        src: ['assets/**/*.js'],
        dest: 'assets/js/<%= pkg.name %>.js'
      }
    },
    uglify: {
      options: {
        banner: '/*! <%= pkg.name %> <%= grunt.template.today("dd-mm-yyyy") %> */\n'
      },
      dist: {
        files: {
          'assets/js/<%= pkg.name %>.min.js': ['<%= concat.dist.dest %>']
        }
      }
    },
  });

  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-concat');

  grunt.registerTask('default', ['concat', 'uglify']);

};

我通常不回答我的 onw 问题，尽管我相信依靠服务器来编译、缓存和检查缓存版本不是可行的方法。在生产环境中维护不必要的处理器和系统。