现在市面上很多的webapp都提供模板功能,所谓模板就是一系列元素的集合,模板的制作一般都需要设计师先在Photoshop等软件中制作好设计好,然后再一定的方式来还原设计稿,要么需要编码要么需要在某些应用中按照设计稿重画设计生成模板数据,都还是比较麻烦的,我们能不能通过psd文件直接生成模板呢?要做到这点我们就需要解析psd文件,而psd文件是Photoshop软件的涉及保存文件,浏览器并不能直接识别,所幸的是psd.js赋予了我们这样的能力。
foxpsd是一个用来解析PhotoShop的PSD文件的 JavaScript 库,支持在浏览器上运行以及Node.js环境中使用,通过psd.js我们可以处理PSD文档并得到关键数据,例如:
1、文件结构
2、文件大小
3、图层/目录大小+定位
4、图层/目录名
5、图层/目录可见性和不透明度
6、字体数据
7、文本内容
8、字体种类,大小,颜色
9、颜色模式和相应数值
10、矢量蒙版数据
11、平面图像数据
12、图层组合
一、服务端使用
1、安装
PSD.js没有原生依赖项,我们可以通过npm install psd --save来安装psd.js并将其加入到我们的项目依赖中。