Angular 1.6项目压缩后报错：Babel函数提升致Angular异常

这问题我维护Angular 1.x旧项目时踩过一模一样的坑！核心矛盾就是：Uglify默认的压缩规则会对函数进行提升优化，但Angular 1.x完全依赖代码的执行顺序来完成模块注册、依赖注入——而Babel转译ES6代码时生成的那些辅助函数（比如_classCallCheck这类）被提前后，直接打乱了Angular初始化的时机，导致模块找不到、依赖注入失败这类异常。

给你几个一步步解决的方案，按优先级来：

1. 直接禁用Uglify的函数提升（最快见效） #

在grunt-contrib-uglify的配置里，给compress选项加上hoist_funs: false，彻底关闭函数提升的优化：

uglify: {
  options: {
    compress: {
      hoist_funs: false, // 关键配置：禁止Uglify提升函数
      // 你原来的其他压缩选项（比如drop_console、dead_code）可以保留
    },
    mangle: true // 混淆可以正常开，不影响
  },
  dist: {
    files: {
      'dist/app.min.js': ['dist/app.concat.js']
    }
  }
}

为什么这能解决？因为Angular 1.x的模块注册（比如angular.module('myApp', [])）是顺序敏感的——如果被提升的Babel辅助函数跑到了Angular核心代码或者你的模块注册代码前面，会导致Angular还没完成初始化就被调用，直接抛出Unknown provider或者Module not available这类错误。

2. 优化Babel转译，减少全局辅助函数 #

如果禁用函数提升后压缩率下降太多，你可以调整Babel配置，把全局辅助函数改成局部引入，降低Uglify优化的影响：
安装@babel/plugin-transform-runtime（注意对应Babel 6的版本，适配你的Angular 1.6项目），然后在Grunt的Babel配置里加上这个插件：

babel: {
  options: {
    presets: ['es2015'],
    plugins: ['@babel/plugin-transform-runtime']
  },
  dist: {
    files: [{
      expand: true,
      cwd: 'src/js',
      src: ['**/*.js'],
      dest: '.tmp/js'
    }]
  }
}

这个插件会把Babel生成的辅助函数从全局作用域移到局部，或者通过模块引入，这样Uglify即使做提升，也不会影响到Angular模块的执行顺序。

3. 确认合并顺序的正确性 #

最后别忘了检查grunt-contrib-concat的文件顺序——必须保证先加载Angular核心库，再加载第三方依赖，最后加载你自己的业务代码：

concat: {
  options: {
    separator: ';' // 用分号分隔文件，避免语法错误
  },
  dist: {
    src: [
      'vendor/angular.min.js',
      'vendor/angular-ui-router.min.js', // 其他第三方依赖按顺序放
      '.tmp/js/**/*.js' // 自己的转译后代码放在最后
    ],
    dest: 'dist/app.concat.js'
  }
}

很多时候压缩后出问题，根源其实是合并顺序错了，导致Angular还没加载就被调用，别漏了这一步验证！

内容的提问来源于stack exchange，提问作者Coss