如何利用Grunt单独压缩各个JS和CSS文件,并生成对应的Source Map
现在的项目中需要将各个JS和CSS文件压缩成对应独立的min文件,并要求生成对于的Source Map。这么琐碎繁杂的事情当然得交给Grunt来做了。花了2个小时上网搜索了下各种解决方案并研究了下,最终达到了我想要的效果。具体见代码:1. package.json{ "name": "xxx", "version":...
现在的项目中需要将各个JS和CSS文件压缩成对应独立的min文件,并要求生成对于的Source Map。这么琐碎繁杂的事情当然得交给Grunt来做了。花了2个小时上网搜索了下各种解决方案并研究了下,最终达到了我想要的效果。具体见代码:1. package.json{ "name": "xxx", "version":...
前端有一项重要的工作就是切图, 然后把图标拼成sprite, 在目前这个node.js, grunt满天飞的年代, 还手工拼图, 也太out了吧.想办法把我们从繁复的工作中解脱出来, 利用工具更有效率的工作, 也是前端的一项重要工作嘛.今天我们要介绍下grunt-css-sprite这个package.具体如何操作呢?1.假设你目录结构是这样的----src --------js -----...
CSS3的Flex属性是一个非常有用的布局方式.一. 它的作用如果元素容器没有足够的空间,我们无需计算每个元素的宽度,就可以设置他们在同一行;可以快速让他们布局在一列;可以方便让他们对齐容器的左、右、中间等;无需修改结构就可以改变他们的显示顺序;如果元素容器设置百分比和视窗大小改变,不用提心未指定元素的确切宽度而破坏布局,因为容器中的每个子元素都可以自动分配容器的宽度或高度的比例。二. 它的...
记得去年初刚开始接触移动端页面制作时, 在ios4和android2.*测试position fixed, 发现都没有效果, 然后移动端浏览器不支持fixed的印象就深深刻在了我的脑海里.最近, 项目中某个页面又需要使用fixed的效果. 基于我以前的经验, 我直接使用了js去处理. 今天在看一个页面和同事交流时发现原来ios5以上和android3.0以上都较完美滴支持fixed了.具体支...
前不久开始负责公司的EDM模板前端开发.看了下公司以前同事制作的EDM模板, 代码真是不敢恭维. 最明显的错误居然在页面上用<style>.做了几个EDM下来, 也积累了点经验. 除了网上常见的那些注意事项, 还有下面这些. 写下来, 对自己对别人都会有用:1. 所有图片设置border="0" style="display:block";2. 所有链接设置text-decora...