AngularJS压缩JS技巧分析


Posted in Javascript onNovember 08, 2016

本文实例讲述了AngularJS压缩JS的操作技巧。分享给大家供大家参考,具体如下:

大多数web项目在发布时候都会对js代码进行压缩,目的是为了减少js文件的大小,节省一点流量。

它的原理很简单,就是对参数及部分变量名和函数进行重命名。

但是这种工作方式在AngularJS的应用中会有例外。

由于AngularJS的依赖注入是根据参数名进行注入的,显然,对参数进行重命名会破坏这个机制。

如果不进行特殊处理,进行压缩(minify)之后,在执行时将会出现这样的错误

Unknow provider: aProvider<-a

对于这种错误的官方解释是:找不到依赖的服务

也就是说这种依赖注入会出现错误。

好在AngularJS内置了一种标准机制来处理这个问题.

最简单也最常见的方式就是用数组代替函数。如:

.controller('RegisterCtrl', ['$scope', '$interval', '$timeout', function ($scope, $interval, $timeout) {
  //do something
}]);

数组的最后一个元素始终是一个函数,而前面几个参数都是字符串,和这个函数中的参数一一对应。

另一种形式便是所谓的Annotation方式。

var objCtrl = function($scope, $timeout, $interval){
  // do something
}
//给objCtrl函数增加一个$inject属性,它是一个数组,定义了需要被注入的对象
objCtrl.$inject = ['$scope', '$interval', '$timeout'];

这里的依赖注入形式不仅限于Controller,一切需要DI(依赖注入的directive、factory、services等)都可以采用这两种方式。

希望本文所述对大家AngularJS程序设计有所帮助。

Javascript 相关文章推荐
js AspxButton的客户端操作
Jun 26 Javascript
js 操作符实例代码
Oct 24 Javascript
js对象基础实例分析
Jan 13 Javascript
JavaScript 学习笔记之变量及其作用域
Jan 14 Javascript
Node.js 异步编程之 Callback介绍(一)
Mar 30 Javascript
PageSwitch插件实现100种不同图片切换效果
Jul 28 Javascript
jquery实现清新实用的网页菜单效果
Aug 28 Javascript
js实现网页收藏功能
Dec 17 Javascript
javascript解决小数的加减乘除精度丢失的方案
May 31 Javascript
jQuery调用Webservice传递json数组的方法
Aug 06 Javascript
ES6下React组件的写法示例代码
May 04 Javascript
微信小程序图片选择、上传到服务器、预览(PHP)实现实例
May 11 Javascript
jQuery的Read()方法代替原生JS详解
Nov 08 #Javascript
bootstrap fileinput完整实例分享
Nov 08 #Javascript
AngularJS动态加载模块和依赖的方法分析
Nov 08 #Javascript
JS文件上传神器bootstrap fileinput详解
Jan 28 #Javascript
Javascript数组循环遍历之forEach详解
Nov 07 #Javascript
关于webuploader插件使用过程遇到的小问题
Nov 07 #Javascript
jQuery webuploader分片上传大文件
Nov 07 #Javascript
You might like
浅谈Laravel中的三种中间件的作用
2019/10/13 PHP
jquery 图片 上一张 下一张 链接效果(续篇)
2010/04/20 Javascript
利用函数的惰性载入提高javascript代码执行效率
2014/05/05 Javascript
ECMAScript 5严格模式(Strict Mode)介绍
2015/03/02 Javascript
推荐10 款 SVG 动画的 JavaScript 库
2015/03/24 Javascript
jQuery取消ajax请求的方法
2015/06/09 Javascript
JavaScript实现点击按钮切换网页背景色的方法
2015/10/17 Javascript
详解JavaScript中数组的reduce方法
2016/12/02 Javascript
JS正则表达式修饰符中multiline(/m)用法分析
2016/12/27 Javascript
angular 基于ng-messages的表单验证实例
2017/05/04 Javascript
理解 javascript 中的函数表达式与函数声明
2017/07/07 Javascript
浅析Vue自定义组件的v-model
2017/11/26 Javascript
微信小程序switch组件使用详解
2018/01/31 Javascript
Vue 进阶之路(三)
2019/04/18 Javascript
python flask解析json数据不完整的解决方法
2019/05/26 Python
Django框架orM与自定义SQL语句混合事务控制操作
2019/06/27 Python
基于python使用tibco ems代码实例
2019/12/20 Python
Python的形参和实参使用方式
2019/12/24 Python
python 将列表里的字典元素合并为一个字典实例
2020/09/01 Python
来自南加州灵感的工作和娱乐服装:TravisMathew
2019/05/01 全球购物
Currentbody法国:健康与美容高科技产品
2020/08/16 全球购物
焊接专业毕业生求职信
2013/10/01 职场文书
应届生新闻编辑求职信
2013/11/19 职场文书
2014婚礼司仪主持词
2014/03/14 职场文书
仓库文员岗位职责
2014/04/06 职场文书
导师推荐信范文
2014/05/09 职场文书
家长建议怎么写
2014/05/15 职场文书
校园运动会广播稿
2014/10/06 职场文书
个人公司授权委托书范本
2014/10/12 职场文书
2014年党建工作汇报材料
2014/11/02 职场文书
党风廉政建设个人总结
2015/03/06 职场文书
卢旺达饭店观后感
2015/06/05 职场文书
Python列表删除重复元素与图像相似度判断及删除实例代码
2021/05/07 Python
手把手教你导入Go语言第三方库
2021/08/04 Golang
MySQL 用 limit 为什么会影响性能
2021/09/15 MySQL
使用vuex-persistedstate本地存储vuex
2022/04/29 Vue.js