使用RequireJS模块化后代码被拆分成多个JS文件了,在部署生产环境需要压缩合并,RequireJS提供了一个打包压缩工具r.js来对模块进行合并压缩。r.js非常强大,不但可以压缩js,css,甚至可以对整个项目进行打包。

r.js的压缩工具使用UglifyJSClosure 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压缩合并的更多相关文章

  1. ASP.NET MVC 中CSS JS压缩合并 功能的使用方法

    通过压缩合并js文件和css文件,可以减少 服务器的响应 次数和 流量,可以大大减小服务器的压力,对网站优化有比较明显的帮助!压缩合并 css 文件和js文件是网站优化的一个 比较常用的方法. ASP ...

  2. 【转】asp.net mvc css/js压缩合并 --- combres

    转自:http://www.cnblogs.com/zxktxj/archive/2012/05/30/2526246.html NuGet   网站:http://nuget.codeplex.co ...

  3. gulp之css,js压缩合并加密替换

    为了防止客户端的静态资源缓存,我们需要每次更新css或js的时候,通过md5或时间戳等方式重新命名静态资源.让客户端可以重新请求资源,而不是从缓存里取.然后html模板里的src也要做相应的修改.当然 ...

  4. 如何应用r.js对requirejs下的js代码合并

    1.在根目录新建build.js ({ baseUrl:'js', paths:{ jquery:'static/jquery-1.10.2.min', underscore:'static/unde ...

  5. 引用:使用grunt 压缩 合并js、css文件

    引用:https://www.jianshu.com/p/08c7babdec65 压缩 js 文件 1.创建一个目录 名为grunt   目录.png 2.在grunt目录下创建一个 src目录,存 ...

  6. 编写gulpfile.js文件:压缩合并css、js

    使用gulp一共有四个步骤: 1. 全局安装 gulp: $ npm install --global gulp 2. 作为项目的开发依赖(devDependencies)安装: $ npm inst ...

  7. gulp完成javascript压缩合并,css压缩

    最近需要对项目进行优化,主要是对js的压缩合并和css文件的压缩,查找相关资料之后发现gulp可以实现相关的功能,特此分享一下使用心得. 1.安装gulp gulp是基于Node.js的前端构建工具. ...

  8. gulp实时编译less,压缩合并requirejs模块文件

    gulp的使用命令简单,就几个,gulp的简单使用教材可以参考一点的gulp使用教材(http://www.ydcss.com/archives/18). 下面就简单的介绍这些命令如何互相配合的完成前 ...

  9. requireJs压缩合并路径问题

    描述 随着前端开发的重要性,以及业务的复杂性,前端的模块化开发也被大众所接收,最常见的js框架requireJs,一个js文件对应一个模块,方便开发人员调试与维护,但是一个文件对应一个模块增加了htt ...

随机推荐

  1. 什么是JWT(JSON WEB TOKEN)

    转自于:http://www.jianshu.com/p/576dbf44b2ae 什么是JWT Json web token(JWT)是为了网络应用环境间传递声明而执行的一种基于JSON的开发标准( ...

  2. 《软件测试的艺术(原书第2版)》【PDF】下载

    <软件测试的艺术(原书第2版)>[PDF]下载链接: https://u253469.ctfile.com/fs/253469-231196343 内容简介 本书以一次自评价测试开篇,从软 ...

  3. OC学习14——谓词

    一.谓词的基本概念与使用 1.谓词(NSPredicate)用于定义一个逻辑条件,通过该条件可执行搜索或内存中的过滤操作.上一篇文章中介绍的集合都提供了使用谓词对集合进行过滤的方法.OC中的谓词操作是 ...

  4. ArcGIS API for JavaScript 4.2学习笔记[11] 官方第五章Popups(弹窗)概览与解释

    直接跳过第三第四章了,第三章Layer和第四章可视化,怎么说呢,Layer是组织数据的,是Map的属性之一.可视化属于符号化编程,暂时不看. 第五章是对数据.结果的显示,类似于alert()..NET ...

  5. C#中级-Windows Service程序安装注意事项

    一.前言 这周除了改写一些识别算法外,继续我的Socket服务编写.服务器端的Socket服务是以Windows Service的形式运行的. 在我完成Windows Service编写后,启动服务时 ...

  6. js scrollTop 事件

    代码: window.onscroll = function() { var t = document.documentElement.scrollTop || document.body.scrol ...

  7. 重温javascript数据类型

    在javaScript中,有五种简单的数据类型,分别是 Undefined Null Boolean Number String 还有一种复杂的数据类型object,object本质是有一组无序的名值 ...

  8. 从源码(编译)安装golang 二

    h1 { margin-top: 0.6cm; margin-bottom: 0.58cm; direction: ltr; color: #000000; line-height: 200%; te ...

  9. php使用websocket示例详解

    一.php 中处理 websocket WebSocket 连接是由客户端主动发起的,所以一切要从客户端出发.第一步是要解析拿到客户端发过来的 Sec-WebSocket-Key 字符串. 复制代码代 ...

  10. thinkinginjava学习笔记08_接口

    抽象类和抽象方法 抽象方法是指没有具体实现的方法,仅仅有方法的声明和没有方法体:使用abstract关键字定义一个抽象方法:包含抽象方法的类成为抽象类,如果一个类中包含抽象方法则必须使用abstrac ...