一句命令快速合并 JS、CSS
在项目开发环境下,我们会把 JS 代码尽可能模块化,方便管理和修改,这就避免不了会出现一个项目自身 JS 文件数量达到 10 个或者更多。
而项目上线后,会要求将所有 JS 文件合并为 1 个或者几个,手动的操作虽然也不是问题,但每次修改更新都要手动操作合并一遍,这就肯定是个噩梦了。
这种情况下,一些工具也就随之产生,比如在线合并,一些网站提供js文件上传,然后合并,但这还是很麻烦,如果开发环境没有网络呢?
这会我就想到了 windows 系统下的 cmd 里的 copy 命令,它虽然是个复制的功能,但实则也是可以实现合并文件的需求,下面就看下这句代码:
copy a.js+b.js+c.js abc.js /b
相信不会太多编程的人阅读上面那句代码也能大致读懂意思:通过 copy 命令将 a.js b.js c.js 合并为一个 abc.js,最后的 /b 表示文件为二进位文件,copy 命令的其它参数可以在 cmd 里输入 copy /? 学习,这里就不再细述。
说到这里,其实 windows 本身就可以完成我们的需求,也不用安装什么其它工具了,下面我们要做的就是将这一切操作更简单。
我们在项目存放 JS 的文件夹下新建一个 TXT 文件,将代码复制进去,并修改需要合并哪些文件,最后保存并将 TXT 修改为 BAT 后缀,如:
copy core.js+hros.app.js+hros.appmanage.js+hros.base.js+hros.copyright.js+hros.desktop.js+hros.dock.js+hros.folderView.js+hros.grid.js+hros.maskBox.js+hros.navbar.js+hros.popupMenu.js+hros.searchbar.js+hros.startmenu.js+hros.taskbar.js+hros.uploadFile.js+hros.wallpaper.js+hros.widget.js+hros.window.js+hros.zoom.js+templates.js+util.js core.min.js /b
接下来我们双击下那个 BAT 文件,看到效果了吧?这就是我们想要的。以后每次上线前,只需双击下这个文件,系统就会自动合并并生成一个合并好的文件,比起其它什么工具,这个的效率简直无法直视。
如果你本地还安装过 UglifyJS 这个工具,可以在代码后面加一句压缩的代码,如:
copy core.js+hros.app.js+hros.appmanage.js+hros.base.js+hros.copyright.js+hros.desktop.js+hros.dock.js+hros.folderView.js+hros.grid.js+hros.maskBox.js+hros.navbar.js+hros.popupMenu.js+hros.searchbar.js+hros.startmenu.js+hros.taskbar.js+hros.uploadFile.js+hros.wallpaper.js+hros.widget.js+hros.window.js+hros.zoom.js+templates.js+util.js core.min.js /b
uglifyjs core.min.js -m -o core.min.js
这样每次合并好后就自动压缩了,又省了一步操作。
CSS 合并同理。
一句命令快速合并 JS、CSS的更多相关文章
- 【前端】一句命令快速合并压缩 JS、CSS
引用自:一句命令快速合并 JS.CSS 在项目开发环境下,我们会把 JS 代码尽可能模块化,方便管理和修改,这就避免不了会出现一个项目自身 JS 文件数量达到10个或者更多. 而项目上线后,会要求将所 ...
- Grunt的配置及使用(压缩合并js/css)
Grunt的配置及使用(压缩合并js/css) 安装 前提是你已经安装了nodejs和npm. 你能够在 nodejs.org 下载安装包安装.也能够通过包管理器(比方在 Mac 上用 homebre ...
- Web性能优化之动态合并JS/CSS文件并缓存客户端
来源:微信公众号CodeL 在Web开发过程中,会产生很多的js/css文件,传统的引用外部文件的方式会产生多次的http请求,从而加重服务器负担且网页加载缓慢,如何在一次请求中将多个文件一次加载出来 ...
- 利用nginx concat模块合并js css
前言: nginx-http-concat模块是由淘宝网开发的,现在淘宝网合并js和css正是用这个模块,如链接http://a.tbcdn.cn/??s/kissy/1.2.0/kissy-min. ...
- 批处理/命令行合并js,递归合并子目录js文件
for /r %%i in (*.js) do type "%%i">>xxx-all.js java -jar yuicompressor.jar --type js ...
- maven 压缩、合并 js, css
转载自:http://blog.csdn.net/fangxing80/article/details/17639607 我们知道在 Web 应用开发中为了提高客户端响应速度,需要将页面使用的资源最小 ...
- 前端构建工具 Gulp 压缩合并JS/CSS 并添加版本号、ES6转ES5
Gulp 基于 Node.js 的前端构建工具,可以实现前端代码的编译(sass.less).压缩合并(JS.CSS).测试:图片的压缩:已经添加 JS 和 CSS 版本号,防止浏览器缓存. 1. 安 ...
- 转:利用node压缩、合并js,css,图片
1.安装nodejs http://nodejs.org/ 2.安装各自的node package js我用的是UglifyJS github地址:https://github.com/mishoo/ ...
- 引用:使用grunt 压缩 合并js、css文件
引用:https://www.jianshu.com/p/08c7babdec65 压缩 js 文件 1.创建一个目录 名为grunt 目录.png 2.在grunt目录下创建一个 src目录,存 ...
随机推荐
- Populating Next Right Pointers in Each Node II--leetcode难题讲解系列
Given a binary tree struct TreeLinkNode { TreeLinkNode *left; TreeLinkNode *right; TreeLinkNode *nex ...
- ArchLinux 下架设PPTPD VPN服务
直接上命令吧: 安装: pacman -Sy pacman -S pptpd 配置: vim /etc/pptpd.conf option /etc/ppp/options.pptpd stimeou ...
- android 代码控制控件的长宽,小技巧
要在代码里改变ImageView 的长宽,如图 通过拿到contentImage这对象的控件参数,再去改变,再设置 , 上图的contentImage为ImageView对象: 而这里 要提醒的是,L ...
- Android 学习笔记之如何实现简单相机功能
PS:看来算法和数据结构还是非常有用的,以后每天都练习两道算法题目...这次忘了对代码进行折叠了..导致篇幅过长... 学习内容: 1.Android如何实现相机功能... 2.如何实现音频的录制.. ...
- CentOS6.5菜鸟之旅:安装rpmforge软件库
一.rpmforge软件库 rpmforge是包含4000多种CentOS软件的软件库,被CentOS社区认为是安全和稳定的软件库. 二.安装rpmforege 1. 在http:/ ...
- Parameter配置文件获取
public class ConfigInfo { public static ParametersHelper Parameters { get { return new ParametersHel ...
- [Solution] DI原理解析及Castle、Unity框架使用
本节目录 DI介绍 DI基本原理 DI框架 Castle Windsor Unity Autofac Spring.Net DI介绍 控制反转(Inversion of Control,英文缩写为Io ...
- Sprint第三个冲刺(第二天)
一.Sprint介绍 任务进度: 二.Sprint周期 看板: 燃尽图:
- sprint3 总结
sprint3 本次的主要任务是找项目中的bug,并与客户不断地沟通以满足客户的要求.队友主要负责找项目中的bug或提出一些建议.我主要是负责与客户沟通和修复bug.总的来说进展还算顺利. 团队贡献分 ...
- STL or Force --- CSU 1553: Good subsequence
Good subsequence Problem's Link: http://acm.csu.edu.cn/OnlineJudge/problem.php?id=1553 Mean: 给你一个长 ...