RequireJS模块化后JS压缩合并
使用RequireJS模块化后代码被拆分成多个JS文件了,在部署生产环境需要压缩合并,RequireJS提供了一个打包压缩工具r.js来对模块进行合并压缩。r.js非常强大,不但可以压缩js,css,甚至可以对整个项目进行打包。
r.js的压缩工具使用UglifyJS或Closure Compiler。默认使用UglifyJS(jQuery也是使用它压缩)。此外r.js需要node.js环境,当然它也可以运行在Java环境中如Rhino。JAVA环境使用Ant构建可以参考另外一篇RequireJS optimizer Ant task有介绍。node环境参考RequireJS模块化与GruntJS构建。
本篇介绍require.js官方文档中介绍的方法。
build.xml
{ appDir: '../www', baseUrl: 'js/lib', paths: { app: '../app' }, dir: '../www-built', modules: [ //First set up the common build layer. { //module names are relative to baseUrl name: '../common', //List common dependencies here. Only need to list //top level dependencies, "include" will find //nested dependencies. include: ['jquery', 'app/lib', 'app/controller/Base', 'app/model/Base' ] }, //Now set up a build layer for each page, but exclude //the common one. "exclude" will exclude nested //the nested, built dependencies from "common". Any //"exclude" that includes built modules should be //listed before the build layer that wants to exclude it. //"include" the appropriate "app/main*" module since by default //it will not get added to the build since it is loaded by a nested //require in the page*.js files. { //module names are relative to baseUrl/paths config name: '../page1', include: ['app/main1'], exclude: ['../common'] }, { //module names are relative to baseUrl name: '../page2', include: ['app/main2'], exclude: ['../common'] } ]} |
在node环境下执行 node r.js -o build.js 就可以压缩合并模块。
项目参考https://github.com/requirejs/example-multipage/blob/master/tools/build.js
RequireJS模块化后JS压缩合并的更多相关文章
- ASP.NET MVC 中CSS JS压缩合并 功能的使用方法
通过压缩合并js文件和css文件,可以减少 服务器的响应 次数和 流量,可以大大减小服务器的压力,对网站优化有比较明显的帮助!压缩合并 css 文件和js文件是网站优化的一个 比较常用的方法. ASP ...
- 【转】asp.net mvc css/js压缩合并 --- combres
转自:http://www.cnblogs.com/zxktxj/archive/2012/05/30/2526246.html NuGet 网站:http://nuget.codeplex.co ...
- gulp之css,js压缩合并加密替换
为了防止客户端的静态资源缓存,我们需要每次更新css或js的时候,通过md5或时间戳等方式重新命名静态资源.让客户端可以重新请求资源,而不是从缓存里取.然后html模板里的src也要做相应的修改.当然 ...
- 如何应用r.js对requirejs下的js代码合并
1.在根目录新建build.js ({ baseUrl:'js', paths:{ jquery:'static/jquery-1.10.2.min', underscore:'static/unde ...
- 引用:使用grunt 压缩 合并js、css文件
引用:https://www.jianshu.com/p/08c7babdec65 压缩 js 文件 1.创建一个目录 名为grunt 目录.png 2.在grunt目录下创建一个 src目录,存 ...
- 编写gulpfile.js文件:压缩合并css、js
使用gulp一共有四个步骤: 1. 全局安装 gulp: $ npm install --global gulp 2. 作为项目的开发依赖(devDependencies)安装: $ npm inst ...
- gulp完成javascript压缩合并,css压缩
最近需要对项目进行优化,主要是对js的压缩合并和css文件的压缩,查找相关资料之后发现gulp可以实现相关的功能,特此分享一下使用心得. 1.安装gulp gulp是基于Node.js的前端构建工具. ...
- gulp实时编译less,压缩合并requirejs模块文件
gulp的使用命令简单,就几个,gulp的简单使用教材可以参考一点的gulp使用教材(http://www.ydcss.com/archives/18). 下面就简单的介绍这些命令如何互相配合的完成前 ...
- requireJs压缩合并路径问题
描述 随着前端开发的重要性,以及业务的复杂性,前端的模块化开发也被大众所接收,最常见的js框架requireJs,一个js文件对应一个模块,方便开发人员调试与维护,但是一个文件对应一个模块增加了htt ...
随机推荐
- Android打赏功能:支付宝转账
适用于个人开发者开发的APP中,让用户打赏给作者,实质上进行支付宝转账到指定账号的功能. 一.打开'支付宝'APP ,点击'收款'功能 ,将收款码(二维码)图片保存到手机上(进一步移到电脑上). 二. ...
- 事务处理操作(COMMIT,ROLLBACK)。复制表。更新操作UPDATE实际工作中一般都会有WHERE子句,否则更新全表会影响系统性能引发死机。
更新操作时两个会话(session)同时操作同一条记录时如果没有事务处理操作(COMMIT,ROLLBACK)则会导致死锁. 复制表:此方法Oracle特有
- springboot 入门八-自定义配置信息(编码、拦截器、静态资源等)
若想实际自定义相关配置,只需要继承WebMvcConfigurerAdapter.WebMvcConfigurerAdapter定义些空方法用来重写项目需要用到的WebMvcConfigure实现.具 ...
- Html中行内元素有哪些?块级元素有哪些?
1.关于行内元素和块状元素的说明 根据CSS规范的规定,每一个网页元素都有一个display属性,用于确定该元素的类型,每一个元素都有默认的display属性值,比如div元素,它的默认display ...
- php通过system()调用Linux命令问题
最近在做php和linux crontab的联调,发现php在linux下的权限问题需要引起注意,调试问题的过程中发现有许多问题前人说的比较零散,我在这里汇总,顺带抛砖引玉一下. 1.$result= ...
- linux命令(shell)
1.cat查看一个文件,linux默认bash 2.echo回显命令 3.ls 4.history历史记录,查看使用过的命令 5.根目录下文件目录 6.bin目录下内容多为应用程序和命令 7.boot ...
- MySQL in or效率对比
本文同时发表在https://github.com/zhangyachen/zhangyachen.github.io/issues/60 考虑如下两个sql: select * from table ...
- lesson - 2 笔记 yum /single /rescue /
一. yum 作用: yum 命令是在Fedora 和RedHat 以及SUSE 中基于rpm 的软件包管理器,它可以使系统管理人员交互和自动化地更新与管理R ...
- BeanShell Sample与控制台交互
应用的场景:业务当中涉及到一些敏感信息,如验证码,银行卡密码等或是动态变化的,不能直接写在脚本中,就需要通过控制台手动输入 如密码已键盘的方式输入,在控制台中以密码的方式显示 处理方法:添加 bean ...
- sql sever[基本] ''增删改'' 随笔
结构语言分类 DDL(数据定义语言) create drop alter 创建删除以及修改数据库,表,存储过程,触发器,索引.... DML(数据操作语言) insert delete ...