seajs模块压缩问题
在优化整理项目代码时,想使用seajs来把代码模块化。看了下官方5分钟上手教程,觉得很不错,也没多想就一直开发下去了,也没出什么问题。等一同事说把代码打包个放到设备上去测试一下,发现怎么也跑不起来,郁闷了。
于是单步调试一把,发现模块一直加不进来。看了一下seajs的原码,明白了是怎么回事。
define模块解析依赖有两种途径,一种是从define(id, deps, factory)中的deps来;还有一种是解析define代码,从require中来。来看一下代码:
Module.define = function (id, deps, factory) {
var argsLen = arguments.length
// define(factory)
if (argsLen === 1) {
factory = id
id = undefined
}
else if (argsLen === 2) {
factory = deps
// define(deps, factory)
if (isArray(id)) {
deps = id
id = undefined
}
// define(id, factory)
else {
deps = undefined
}
}
// Parse dependencies according to the module factory code
if (!isArray(deps) && isFunction(factory)) {
deps = parseDependencies(factory.toString())
}
...
如果传了deps那就不进行解析了,如果传那就进行源码解析:
var REQUIRE_RE = /"(?:\\"|[^"])*"|'(?:\\'|[^'])*'|\/\*[\S\s]*?\*\/|\/(?:\\\/|[^\/\r\n])+\/(?=[^\/])|\/\/.*|\.\s*require|(?:^|[^$])\brequire\s*\(\s*(["'])(.+?)\1\s*\)/g
var SLASH_RE = /\\\\/g function parseDependencies(code) {
var ret = [] code.replace(SLASH_RE, "")
.replace(REQUIRE_RE, function(m, m1, m2) {
if (m2) {
ret.push(m2)
}
}) return ret
}
seajs是对源码正则对比,查找require,也就是说require在seajs模块中,是一个关键字。
那么问题就来了,一般我们使用的压缩工具都变量进行压缩,require不是标准的js关键字,所以经过一压缩require就变成了abcdefg....所以自然就无法使用了。
解析办法有两个:
1. seajs官方给出是seajs标准模块构建工具:https://github.com/seajs/seajs/issues/538 使用spm进行构建。
2. 更换压缩工具,使用一个可以自定义关键字,也就是让压缩工具不压缩require变量。
目前主流的三个压缩工具:YUI Compressor,Google Closure Compiler,UglifyJS。就目前所知,貌似前两个都不支持自定义关键字(?),UglifyJS是支持的。所以可以使用UglifyJS进行压缩
UglifyJS hello.js -o hello.min.js -m -c -r require
通过-r选项来指定变量不压缩。
总的来说使用seajs应该尽量的去使用官方的构建工具。
seajs模块压缩问题的更多相关文章
- 关于用gulp合并压缩seaJs模块
现在很多人都在用seaJs来开发项目,seaJs上手容易,操作简单.但在后期做合并压缩的时候却中了个巨大无比的坑,但坑也总得有人来填.于是花了将近一个星期的时间来填了这坑,现将填坑的一些心得与大家分享 ...
- grunt任务之seajs模块打包
grunt与seajs grunt是前端流行的自定义任务的脚手架工具,我们可以使用grunt来为我们做一些重复度很高的事情,如压缩,合并,js语法检查等.通过定义grunt的配置文件Gruntfile ...
- jquery插件封装成seajs模块
jquery直接在html中引入. jquery插件修改为: define(function (require, exports, moudles) { return function (jquery ...
- Httpd服务入门知识-使用mod_deflate模块压缩页面优化传输速度
Httpd服务入门知识-使用mod_deflate模块压缩页面优化传输速度 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.mod_deflate模块概述 mod_deflate ...
- seajs模块加载与执行原理小记
本文仅讨论具名模块的情况,即通过spm打包出来的模块. 想起ID与路径统一原则,详见https://github.com/seajs/seajs/issues/930 今天又研究了下seajs源码,源 ...
- 飘逸的python - 简明gzip模块压缩教程
压缩数据创建gzip文件 先看一个略麻烦的做法 import StringIO,gzip content = 'Life is short.I use python' zbuf = StringIO. ...
- seajs模块标识命名和解析规则
模块标识采用路径形式,但要注意与路径的区别.require.require.async的第一个参数是模块标识.而seajs.use第一个参数为文件路径. use是全局的,require是局部的.模块标 ...
- seaJS 模块加载过程分析
先看一个seajs的官方example, 以下以seajs.use('main')为例, 解析加载mod main的过程 //app.html seajs.use("main") ...
- 使用mod_deflate模块压缩页面优化传输速度
在HTTPD主配置文件中添加如下,并确保deflate模块是启用的 #vim /etc/httpd/conf/httpd.conf SetOutputFilter DEFLATE//调用一个叫DEFL ...
随机推荐
- text-align:justify小例子
一个使用 text-align: justify; 使元素均匀分布的小例子: <!DOCTYPE html> <html lang="en"> <he ...
- curl抓取信息
<?php $hotel = new curl(false,0); $str = $hotel -> post("http://www.todayinns.com/login.p ...
- iOS学习之页面之间传值的方式总结
传值三种场景: 1.属性传值(从前往后传) 需求:第二个界面标签显示第一个界面输入框文字. 第一步, 在前一个界面定义属性. (语义属性声明为copy); 第二步, 在进入下一个界面之前,给属性传入数 ...
- nodejs安装express遇到的坑
网上很多资料都是npm install express -g; 安装完也不报错,但使用express的时候却报找不到命令: 在网上查了好多,最后用 npm install -g express-gen ...
- Android从相册读取图片
Uri originalUri = data.getData(); //获得图片的uri bm = MediaStore.Images.Media.getBitmap(resolver ...
- Javascript quiz
作为一个勤劳的corder,在大年三十的前一天还留守在公司的最前线.百无聊赖中看到一套关于js的测试题,测试过后发现有些题还是有很大的意义,至少能够让我门对js基础有所重视.本人将每道题的考察点总结了 ...
- While installing plugin in eclipse luna, “Unable to acquire PluginConverter service” and “No repository found” errors appear in logs
http://stackoverflow.com/questions/18767831/while-installing-plugin-in-eclipse-luna-unable-to-acquir ...
- 【Xamarin开发 Android 系列 8】 创建一个Json读取数据应用(上)
后续将内容贴上来...........
- Linux企业级项目实践之网络爬虫(1)——项目概述及准备工作
我们在学习了Linux系统编程之后,需要一些实战项目来提高自己的水平,本系列我们通过编写一个爬虫程序,将我们学习的知识进行综合应用,同时在实现项目的过程中逐渐养成一些有用的思维方式,并具有初步的软件开 ...
- poj 2407 Relatives(简单欧拉函数)
Description Given n, a positive integer, how many positive integers less than n are relatively prime ...