利用gulp 插件gulp.spritesmith 完成小图合成精灵图，并自动输出样式文件
安装依赖 gulpfile.js的配置 const gulp = require("gulp") // 本实例为完成精灵图的合并 const spritesmith = require("gulp.spritesmith") gulp ...
原文：用 gulp.spritesmith 自动化雪碧图
一 安装nodejs之后，要设置两个环境变量 在 计算机右击属性 高级系统设置 高级 环境变量 打开窗口 新建 个环境变量，它们的值分别是nodejs根目录下的node modules路径 及npm的路径 .变量：NODE PATH 值：D: www nodejs node modules .变量：PATH 值：D: www nodejs npm 二 进入images上一层目录，运行 npm in ...
2016-05-24 17:48 2 1645 推荐指数：
相关推荐
gulp.spritesmith修改px为rem单位
移动端开发中，使用gulp.spritesmith进行小图sprite并生成样式，但由于spritesmith默认是以px为单位，所以就把插件的内容修改了下让生成rem单位并且能把background-size设置为雪碧图的宽高。 1.首先修改gulp.spritesmith ...
gulp多张图片自动合成雪碧图
几秒钟就能完成，究竟是什么工具这么神奇呢，他就是gulp的一个插件gulp.spritesmith。下面 ...
vue-cli3使用webpack-spritesmith配置雪碧图
一、背景问题 项目中如果有大量的小图标，如果不使用阿里的iconfont。UI给一个加一个，加一个引用一个，每个图标虽然很小，但是也是一次请求，每次请求都是消耗性能资源的. 二、解决思路 使用webpack-spritesmith可以将所有的icon小图标整合成一张图片。每次都只会请求一次 ...
gulp-css-spriter 雪碧图合成
一、配置 gulp的雪碧图功能没有grunt那么强大，但是类似功能也支持，功能稍微弱一些，但是也很棒 npm地址：https://www.npmjs.com/package/gulp-css-spriter/ https://www.npmjs.com/package ...
gulp自动化部署：gulp发布express项目（二）
原文：https://my.oschina.net/songzhu/blog/610337 一、服务器准备 服务器ip地址为：172.16.70.174 1.安装 Node.js ...
前端自动生成雪碧图
作为前端开发，我们在开发网页的时候，往往需要在页面上展示很多图片的icon，由于矢量字体的icon只能展示纯色的字体，对于一些颜色丰富的页面icon我们还需要使用图片去展示。为了提高网页加载的速度，往往需要将零散的小图标拼成一张图，通过background-position来定位就可以了。传统 ...
前端自动化gulp遇上es6从 无知到深爱
Gulp是什么？ Gulp是前端自动化的工具，但Gulp能用来做什么 1.搭建web服务器 2.使用预处理器Sass，Less 3.压缩优化，可以压缩JS CSS Html 图片 4.自动将更新变化的代码实时显示在浏览器 5.前端测试 ...... 这些都不是他的全部功能，社区丰富 ...