那怎样打包呢，虽然有resource-packages这样的方案，可是我们的核心用户还在玩ie6这种时尚的浏览器呢！

我的方案：

• CSS：CSS可以当成字符串存在js里，并由js动态加到页面上，页面用的可能不适合，但组件通常不会影响。
• image：CSS里用的图片用dataURI（RFC 2397）跟MHTML（RFC 2557）的方式编到js里面。（秦歌写的dataURI和MHTML依然推荐给不知道是什么东东的同学看）。CSS里如果要绝对路径同样可以存js，js如果有直接用到的理论上也是可以，但js通常只改className会比较好。
• flash：一些比较小的flash，比如存储，复制等也可以选择打包，不过现在米解决非IE的问题，非IE使用外链吧

这个有个打包测试的例子。

一些细节和纠结的地方

1. 所有图片都打包到js里不一定合理，打包进去的应该是必用的图片。
   那排除的图片是再打一个包好呢还是直接用图片？
2. 图片可以先压后编，我选用的图片压缩工具是pngout，而且一般是用-s5。
   有人做了些测试Uncompressed data in base64? Probably not，大家自行判断。
3. 重复的图片引用直接用dataURI会搞得很大很大，gzip又笨得跟猪一样不会压掉。
   我是选用存成js变量，淘宝的同学是用提class的方式
4. MHTML在ie7+/vista缺少结束分割符无法显示，win03sp2缺少Content-Type会有安全提示，原因都MIME不标准，不是所有的东西都可以省。
5. 是选择把所有的东西都打包在一个文件还是按MHTML跟dataURI分类型打包成两份在server按ua派文件或由类库智能去读取，好像后者比较和谐。
6. swf用dataURI编入有问题，据说fp8没问题，现在都fp10了。
   另一种solo的方案就是把js打包到swf，不过感觉不和谐

multipart/related例子

不算标准但能跑，换行也是很重要的

Content-Type:multipart/related;boundary="_BAIDU_YOUA_BB_YEP"

--_BAIDU_YOUA_BB_YEP
Content-Type:image/png
Content-Location:logo.png
Content-Transfer-Encoding:base64

...base64...

--_BAIDU_YOUA_BB_YEP
Content-Type:image/png
Content-Location:nono.png
Content-Transfer-Encoding:base64

...base64...

--_BAIDU_YOUA_BB_YEP--

btw:上篇文章的评论里发现了这个打包的站，输出界面很帅

因为之前发现在vista上的ie7有bug，且没有好解决方案，所以一直不敢项目上使用，之前虽然有看到有个用304的方案(via Data URIs, MHTML and IE7/Win7/Vista blues)，但觉一来做起来折腾，一来效果也不好，特别是hover时。

ie7 vista的bug大约这样，相应文件一旦local cache 后，浏览器就读不到。

今天，我要骄傲的跟大家，有两种可行的解决方案

方案1

Content-Type:multipart/related;boundary="_aoao_org_cn"
--_aoao_org_cn
Content-Location:aoao.gif
Content-Transfer-Encoding:base64
... base64...
--_aoao_org_cn--

注意最后的“--_aoao_org_cn--” ，查了不少资料，原来标准写法就是这样！（via rfc2557 第7页） 囧rz

这个故事跟我们说一件事：有问题，查文档。 我之前一直以为cache到本地后浏览器木权限用

方案2

------=_NextPart_000_0000_12345678.12345678
Content-Location:aoao.gif
Content-Transfer-Encoding:base64
... base64...

如果你有用ie存mht并研究结构的话，应该会觉得很眼熟，很神奇，但唯一的问题就是只能用一张图片，囧rz 反正有方案1，无视之。

伴随这个不是bug的bug的终结，相应的工具与应用也要浮出水面了。