位置: 编程技术 - 正文

小心!AngularJS结合RequireJS做文件合并压缩的那些坑(angularjs常用总结)

编辑:rootadmin

推荐整理分享小心!AngularJS结合RequireJS做文件合并压缩的那些坑(angularjs常用总结),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:angularjs2,angular.min.js,angular.json详解,angular script,angularjs1.5,angularjs1.5,angularjs常用总结,angularjs常用总结,内容如对您有帮助,希望把文章链接给更多的朋友!

在项目使用了AngularJS框架,用RequireJS做异步模块加载(AMD),在做文件合并压缩时,遇到了一些坑,有些只是解决了,但不明白原因。

那些坑1. build.js里面的paths必须跟main.js里面的保持一致。

这个build.js就是r.js使用的配置文件,而main.js就是RequireJS的main文件。在合并压缩时候,build.js文件里面也需要写paths,而且还是跟main.js一样,我很奇怪为什么就不能识别main里面的require.config的paths,省得合并的时候还要将paths拷贝过来(我试过build.js里面没有paths,是不能合并的)。(-_-!!!)

2. 某些依赖库需要写整个相对路径才能做合并。

在项目里, 我使用一个叫layer的第三方库(库是以requireJS define写的),一开始只做开发时候,在paths配置了路径后,使用此库只需要用个简称(define依赖时候)。 但在做合并时候,竟然提示文件不存在(因为直接拿简称去拼文件地址了),无奈之下只能修改这个库的使用办法,全部使用到这个库的都写整个相对路径,这个时候开发和做合并才没有错。

3. 合并之后可以运行,加上压缩就不可以。

这个是最严重问题,最严重问题,最严重问题。在文件合并压缩后,使用文件时候,AngularJS运行就不正常了,总是报模块初始化失败,Failed to instantiate module common due to: Error: [$injector:unpr] Unknown provider: e,如下图。

很关键的一个点就是,不压缩可以用,一旦压缩了(用了默认的压缩),使用就会报错。所以思考必定某些东西被“压坏”了,网上某些文章都说是需要下面这样写AngularJS cntroller、directive等,使用的服务用字符串定义。

可是我的整个应用就是这样定义,并没有给它注入错误的机会。最后在无奈之下,就只能配置mangle: false,不混淆变量名,这样做后,合并压缩的文件就能正确使用了!!!

PS:简单说法就是,合并压缩可以,变量名不能混淆(总觉得怪怪的),感觉问题暂时无解。

4. 第二层的require,做合并的时候,是合并不出来。

小心!AngularJS结合RequireJS做文件合并压缩的那些坑(angularjs常用总结)

例如在mian.js里面这样加载模块,在合并时候会发现第二层的require并没有被合并到。

这时需要在build.js加findNestedDependencies: true, 这时才会合并第二层。

合并准备

1、安装nodejs

文件合并压缩基于nodejs,所以先安装nodejs。

2、下载r.js

r.js配合requirejs模块写法对文件进行合并,压缩。

简单配置

配置文件最好写一个build.js,如下:

这里就讲几个关键属性:

baseUrl:所有的模块(般就是js)都相对于这个路径存在。

optimize:优化脚本文件的方式,有下面5种取值方式。

uglify:(默认) 用UglifyJS压缩。 uglify2: 用UglifyJS2( 2.1.2+)压缩。 closure: 使用Google's Closure Compiler 简单优化模式压缩文件, 仅在优化工具使用Java有效。 closure.keepLines:跟closure参数一样, 只不过保留换行符。 none: 不做压缩。

findNestedDependencies:寻找require()里面的require或define调用的依赖。

PS:配置属性还有很多,就不一细细说了。当文件配置好后,就执行命令合并压缩

总结

RequireJS模块的合并压缩还是比较简单的,但是遇到AngularJS,在压缩方面就有些问题了,目前没找到什么更好办法。

标签: angularjs常用总结

本文链接地址:https://www.jiuchutong.com/biancheng/383761.html 转载请保留说明!

上一篇:javascript跑马灯抽奖实例讲解(前端跑马灯实现)

下一篇:实例讲解js验证表单项是否为空的方法(js验证正整数)

  • 6.72的税率是怎么算的
  • 车船税税金及附加计入管理费用嘛
  • 企业收到退税款怎么处理
  • 境外代扣代缴增值税
  • 法人购买车险发票怎么开
  • 二手房交易需缴纳的费用
  • 普票也要盖发票专用章吗
  • 银行开户手续费怎么开发票
  • 递延收益影响当期损益吗
  • 汇算清缴的
  • 主表第17栏应该等于定期
  • 房地产公司支付工程款账务处理
  • 补缴以前年度税费
  • 培训机构开发票的税率是多少钱
  • 报税需要带营业执照吗
  • 进项明细和开票明细不一致怎么办
  • 制造业领用材料规章制度的好处
  • 可持续增长率计算例题
  • 水利建设基金从铁路建设基金港口建设费收入中提取5%
  • mac 磁盘未能分区
  • 开启浏览器模式
  • php 抓取别的网站的内容
  • phpwind教程
  • 电脑右键一直转圈
  • 新公司30天内未办理税务登记
  • 会计账务处理年限规定
  • 增值税发票认证在哪里
  • 免交的增值税要交所得税吗
  • vue3中使用for循环引用多个组件
  • 固定资产提前报废
  • postman操作流程
  • 感知机算法python
  • html的标签大全
  • 用more命令查看文件内容
  • php计时函数
  • 账面价值是历史价值吗
  • 固定资产记到什么账本
  • 企业所得税申报更正怎么操作
  • 销售部门差旅费报销会计分录
  • 增值税发票的规范
  • 盈利能力还有什么能力
  • 结转利润分配的二级明细账户
  • 政府补助的会计准则
  • 开出银行汇票支付货款
  • 抵债资产处置账务实例
  • 预提费用年底一定要冲回吗
  • 其他应付款个人往来的涉税风险
  • 采购商品验收入库的会计分录怎么写
  • 小规模可以开红网吗
  • 初级会计现值的计算
  • 编制记账凭证的依据
  • access数据库导入到sqlserver
  • MySql5.6使用validate password 插件加强密码强度的安装及使用方法
  • Win7 64位系统声卡重装过程中出现失败的解决方法
  • centos uuid
  • win10如何查看系统日志
  • 把mac屏幕切换到桌面desktop
  • hc off line什么意思
  • win7系统IE浏览器打开跳转到360浏览器,怎么阻止
  • win10系统开机桌面图标不见了
  • w10系统每次启动都要选择系统
  • win10天气系统怎么弄掉
  • 360安全卫士检测出来高危漏洞需要修复吗
  • 向量上面有个倒着的v
  • js移动端布局
  • 用python编写登录程序
  • unity 游戏开发教程
  • qt opengl obj
  • html文字美化
  • Python安装教程windous7
  • linux -lc
  • nodejs使用场景
  • shell脚本中获取参数
  • javascript还有人用吗
  • shell脚本语句
  • 安卓中五种常见布局的特点
  • 淄博市税务局投诉电话
  • 发票上的税额由谁填写
  • 陕西省机构改革方案获批
  • 军人残疾证家属享受待遇吗
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设