init

.gitignore

+# Created by .ignore support plugin (hsz.mobi)
+### Node template
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+.env.test
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+
+# next.js build output
+.next
+
+# nuxt.js build output
+.nuxt
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+

dist/index.es.js

+import path from 'path';
+import Color from 'color';
+import generateUUID from 'uuid/v4';
+import hash from 'object-hash';
+import zlib from 'zlib';
+
+/**
+ * Created by rockyl on 2019-08-09.
+ */
+
+const PSD = window['require']('psd');
+
+async function getTree(file) {
+	let psd = await PSD.fromDroppedFile(file);
+
+	const root = {};
+	walk(psd.tree(), root);
+
+	return root;
+}
+
+function walk(psNode, dataNode) {
+	const {left: pLeft = 0, top: pTop = 0,} = psNode.parent || {};
+	const {left, top, width, height, name, layer: {opacity, visible}} = psNode;
+	const x = left - pLeft;
+	const y = top - pTop;
+
+	Object.assign(dataNode, {x, y, width, height, alpha: opacity / 255, visible, name, origin: psNode, label: `${name} > [${x}, ${y}, ${width}, ${height}]`});
+	if (psNode.children() && psNode.children().length > 0){
+		dataNode.children = [];
+	}
+
+	let children = psNode.children();
+	for (let i = children.length - 1; i >= 0; i--) {
+		const childPsNode = children[i];
+
+		const childDataNode = {};
+		dataNode.children.push(childDataNode);
+		walk(childPsNode, childDataNode);
+	}
+}
+
+/**
+ * Created by rockyl on 2019-08-10.
+ */
+
+async function walkNode(node, callback, includeSelf = false) {
+	if (includeSelf) {
+		await callback(node, null);
+	}
+	if (node.children && node.children.length > 0) {
+		for (let childNode of node.children) {
+			await callback(childNode, node);
+			const result = await walkNode(childNode, callback);
+			if (result === true) {
+				break;
+			}
+		}
+	}
+}
+
+/**
+ * Created by rockyl on 2019-09-26.
+ *
+ * 导出zeroing的视图
+ */
+
+async function execute(psdFile, options) {
+	const tree = await getTree(psdFile);
+
+	let viewRoot = {
+		name: path.basename(psdFile.name, '.psd'),
+		type: 'node',
+		uuid: generateUUID(),
+	};
+
+	const assets = [];
+	const imageHashMap = {};
+
+	await walkNode(tree, async function (node, parent) {
+		const {name, x, y, width, height, alpha, visible, origin: {layer, layer: {typeTool, solidColor}}} = node;
+		console.log('walk node:', name);
+		let properties = {
+			width, height, alpha, visible,
+		};
+		let viewNode = {
+			name,
+			properties,
+			uuid: generateUUID(),
+		};
+		let dealLater = true;
+		if (x !== 0) {
+			properties.x = x;
+		}
+		if (y !== 0) {
+			properties.y = y;
+		}
+
+		if (typeTool) {
+			let fontInfo = typeTool();
+			//const fonts = fontInfo.fonts();
+			//const styles = fontInfo.styles();
+			//const {RunLengthArray} = fontInfo.engineData.EngineDict.StyleRun;
+
+			properties.text = fontInfo.textValue;
+			const sizes = fontInfo.sizes();
+			const colors = fontInfo.colors();
+			properties.size = sizes ? sizes[0] || 20 : 20;
+			let [r, g, b, a] = colors[0];
+			properties.fillColor = `rgba(${r}, ${g}, ${b}, ${a / 255})`;
+			/*properties.textflow = {
+				fonts, styles, RunLengthArray,
+			};*/
+			viewNode.type = 'label';
+			dealLater = false;
+		} else if (solidColor) {
+			const {r, g, b} = solidColor();
+			let color = Color({r, g, b});
+
+			let paths = layer.vectorMask().paths;
+			if (paths[2].numPoints === 4) {
+				let isRect = true;
+				for (let i = 3; i < paths.length; i++) {
+					if (paths[i].recordType !== 2) {
+						isRect = false;
+						break;
+					}
+				}
+				if (isRect) {
+					viewNode.type = 'rect';
+					properties.fillColor = '#' + color.rgbNumber().toString(16);
+					dealLater = false;
+				}
+			}
+		}
+
+		if (dealLater) {
+			if (node.hasOwnProperty('children')) {
+				viewNode.type = 'node';
+			} else {
+				viewNode.type = 'image';
+
+				let uuid = generateUUID();
+				const ext = '.png';
+
+				let dataUrl;
+				try {
+					let img = node.origin.toPng();
+					dataUrl = img.src;
+				}catch (e) {
+
+				}
+
+				if (dataUrl) {
+					let base64Data = dataUrl.replace(/^data:image\/\w+;base64,/, "");
+					let buffer = new Buffer(base64Data, 'base64');
+					const fileNameHash = hash(buffer);
+					if (imageHashMap.hasOwnProperty(fileNameHash)) {
+						uuid = imageHashMap[fileNameHash];
+					} else {
+						imageHashMap[fileNameHash] = uuid;
+						assets.push({
+							name,
+							ext,
+							uuid,
+							base64Data,
+							hash: fileNameHash,
+						});
+					}
+
+					properties.source = 'asset://' + uuid;
+				}
+			}
+		}
+
+		let viewParent = parent.view || viewRoot;
+		if (!viewParent.hasOwnProperty('children')) {
+			viewParent.children = [];
+		}
+		viewParent.children.push(viewNode);
+
+		node.view = viewNode;
+	});
+
+	let data = {
+		view: viewRoot,
+		assets,
+	};
+
+	let dataString = JSON.stringify(data);
+	console.log(dataString.length);
+
+	let buf = new Buffer(dataString);
+	return await new Promise((resolve, reject)=>{
+		zlib.gzip(buf,function(err,res){
+			if(err){
+				reject(err);
+			}else{
+				console.log(res.length);
+				resolve(res);
+			}
+		});
+	})
+}
+
+export { getTree, execute as toZeroing };
+//# sourceMappingURL=index.es.js.map

dist/index.js

+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
+
+var path = _interopDefault(require('path'));
+var Color = _interopDefault(require('color'));
+var generateUUID = _interopDefault(require('uuid/v4'));
+var hash = _interopDefault(require('object-hash'));
+var zlib = _interopDefault(require('zlib'));
+
+/**
+ * Created by rockyl on 2019-08-09.
+ */
+
+const PSD = window['require']('psd');
+
+async function getTree(file) {
+	let psd = await PSD.fromDroppedFile(file);
+
+	const root = {};
+	walk(psd.tree(), root);
+
+	return root;
+}
+
+function walk(psNode, dataNode) {
+	const {left: pLeft = 0, top: pTop = 0,} = psNode.parent || {};
+	const {left, top, width, height, name, layer: {opacity, visible}} = psNode;
+	const x = left - pLeft;
+	const y = top - pTop;
+
+	Object.assign(dataNode, {x, y, width, height, alpha: opacity / 255, visible, name, origin: psNode, label: `${name} > [${x}, ${y}, ${width}, ${height}]`});
+	if (psNode.children() && psNode.children().length > 0){
+		dataNode.children = [];
+	}
+
+	let children = psNode.children();
+	for (let i = children.length - 1; i >= 0; i--) {
+		const childPsNode = children[i];
+
+		const childDataNode = {};
+		dataNode.children.push(childDataNode);
+		walk(childPsNode, childDataNode);
+	}
+}
+
+/**
+ * Created by rockyl on 2019-08-10.
+ */
+
+async function walkNode(node, callback, includeSelf = false) {
+	if (includeSelf) {
+		await callback(node, null);
+	}
+	if (node.children && node.children.length > 0) {
+		for (let childNode of node.children) {
+			await callback(childNode, node);
+			const result = await walkNode(childNode, callback);
+			if (result === true) {
+				break;
+			}
+		}
+	}
+}
+
+/**
+ * Created by rockyl on 2019-09-26.
+ *
+ * 导出zeroing的视图
+ */
+
+async function execute(psdFile, options) {
+	const tree = await getTree(psdFile);
+
+	let viewRoot = {
+		name: path.basename(psdFile.name, '.psd'),
+		type: 'node',
+		uuid: generateUUID(),
+	};
+
+	const assets = [];
+	const imageHashMap = {};
+
+	await walkNode(tree, async function (node, parent) {
+		const {name, x, y, width, height, alpha, visible, origin: {layer, layer: {typeTool, solidColor}}} = node;
+		console.log('walk node:', name);
+		let properties = {
+			width, height, alpha, visible,
+		};
+		let viewNode = {
+			name,
+			properties,
+			uuid: generateUUID(),
+		};
+		let dealLater = true;
+		if (x !== 0) {
+			properties.x = x;
+		}
+		if (y !== 0) {
+			properties.y = y;
+		}
+
+		if (typeTool) {
+			let fontInfo = typeTool();
+			//const fonts = fontInfo.fonts();
+			//const styles = fontInfo.styles();
+			//const {RunLengthArray} = fontInfo.engineData.EngineDict.StyleRun;
+
+			properties.text = fontInfo.textValue;
+			const sizes = fontInfo.sizes();
+			const colors = fontInfo.colors();
+			properties.size = sizes ? sizes[0] || 20 : 20;
+			let [r, g, b, a] = colors[0];
+			properties.fillColor = `rgba(${r}, ${g}, ${b}, ${a / 255})`;
+			/*properties.textflow = {
+				fonts, styles, RunLengthArray,
+			};*/
+			viewNode.type = 'label';
+			dealLater = false;
+		} else if (solidColor) {
+			const {r, g, b} = solidColor();
+			let color = Color({r, g, b});
+
+			let paths = layer.vectorMask().paths;
+			if (paths[2].numPoints === 4) {
+				let isRect = true;
+				for (let i = 3; i < paths.length; i++) {
+					if (paths[i].recordType !== 2) {
+						isRect = false;
+						break;
+					}
+				}
+				if (isRect) {
+					viewNode.type = 'rect';
+					properties.fillColor = '#' + color.rgbNumber().toString(16);
+					dealLater = false;
+				}
+			}
+		}
+
+		if (dealLater) {
+			if (node.hasOwnProperty('children')) {
+				viewNode.type = 'node';
+			} else {
+				viewNode.type = 'image';
+
+				let uuid = generateUUID();
+				const ext = '.png';
+
+				let dataUrl;
+				try {
+					let img = node.origin.toPng();
+					dataUrl = img.src;
+				}catch (e) {
+
+				}
+
+				if (dataUrl) {
+					let base64Data = dataUrl.replace(/^data:image\/\w+;base64,/, "");
+					let buffer = new Buffer(base64Data, 'base64');
+					const fileNameHash = hash(buffer);
+					if (imageHashMap.hasOwnProperty(fileNameHash)) {
+						uuid = imageHashMap[fileNameHash];
+					} else {
+						imageHashMap[fileNameHash] = uuid;
+						assets.push({
+							name,
+							ext,
+							uuid,
+							base64Data,
+							hash: fileNameHash,
+						});
+					}
+
+					properties.source = 'asset://' + uuid;
+				}
+			}
+		}
+
+		let viewParent = parent.view || viewRoot;
+		if (!viewParent.hasOwnProperty('children')) {
+			viewParent.children = [];
+		}
+		viewParent.children.push(viewNode);
+
+		node.view = viewNode;
+	});
+
+	let data = {
+		view: viewRoot,
+		assets,
+	};
+
+	let dataString = JSON.stringify(data);
+	console.log(dataString.length);
+
+	let buf = new Buffer(dataString);
+	return await new Promise((resolve, reject)=>{
+		zlib.gzip(buf,function(err,res){
+			if(err){
+				reject(err);
+			}else{
+				console.log(res.length);
+				resolve(res);
+			}
+		});
+	})
+}
+
+exports.getTree = getTree;
+exports.toZeroing = execute;
+//# sourceMappingURL=index.js.map

dist/index.umd.js

+(function (global, factory) {
+	typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('path'), require('color'), require('uuid/v4'), require('object-hash'), require('zlib')) :
+	typeof define === 'function' && define.amd ? define(['exports', 'path', 'color', 'uuid/v4', 'object-hash', 'zlib'], factory) :
+	(global = global || self, factory(global['psd-parse-web'] = {}, global.path, global.Color, global.generateUUID, global.hash, global.zlib));
+}(this, function (exports, path, Color, generateUUID, hash, zlib) { 'use strict';
+
+	path = path && path.hasOwnProperty('default') ? path['default'] : path;
+	Color = Color && Color.hasOwnProperty('default') ? Color['default'] : Color;
+	generateUUID = generateUUID && generateUUID.hasOwnProperty('default') ? generateUUID['default'] : generateUUID;
+	hash = hash && hash.hasOwnProperty('default') ? hash['default'] : hash;
+	zlib = zlib && zlib.hasOwnProperty('default') ? zlib['default'] : zlib;
+
+	/**
+	 * Created by rockyl on 2019-08-09.
+	 */
+
+	const PSD = window['require']('psd');
+
+	async function getTree(file) {
+		let psd = await PSD.fromDroppedFile(file);
+
+		const root = {};
+		walk(psd.tree(), root);
+
+		return root;
+	}
+
+	function walk(psNode, dataNode) {
+		const {left: pLeft = 0, top: pTop = 0,} = psNode.parent || {};
+		const {left, top, width, height, name, layer: {opacity, visible}} = psNode;
+		const x = left - pLeft;
+		const y = top - pTop;
+
+		Object.assign(dataNode, {x, y, width, height, alpha: opacity / 255, visible, name, origin: psNode, label: `${name} > [${x}, ${y}, ${width}, ${height}]`});
+		if (psNode.children() && psNode.children().length > 0){
+			dataNode.children = [];
+		}
+
+		let children = psNode.children();
+		for (let i = children.length - 1; i >= 0; i--) {
+			const childPsNode = children[i];
+
+			const childDataNode = {};
+			dataNode.children.push(childDataNode);
+			walk(childPsNode, childDataNode);
+		}
+	}
+
+	/**
+	 * Created by rockyl on 2019-08-10.
+	 */
+
+	async function walkNode(node, callback, includeSelf = false) {
+		if (includeSelf) {
+			await callback(node, null);
+		}
+		if (node.children && node.children.length > 0) {
+			for (let childNode of node.children) {
+				await callback(childNode, node);
+				const result = await walkNode(childNode, callback);
+				if (result === true) {
+					break;
+				}
+			}
+		}
+	}
+
+	/**
+	 * Created by rockyl on 2019-09-26.
+	 *
+	 * 导出zeroing的视图
+	 */
+
+	async function execute(psdFile, options) {
+		const tree = await getTree(psdFile);
+
+		let viewRoot = {
+			name: path.basename(psdFile.name, '.psd'),
+			type: 'node',
+			uuid: generateUUID(),
+		};
+
+		const assets = [];
+		const imageHashMap = {};
+
+		await walkNode(tree, async function (node, parent) {
+			const {name, x, y, width, height, alpha, visible, origin: {layer, layer: {typeTool, solidColor}}} = node;
+			console.log('walk node:', name);
+			let properties = {
+				width, height, alpha, visible,
+			};
+			let viewNode = {
+				name,
+				properties,
+				uuid: generateUUID(),
+			};
+			let dealLater = true;
+			if (x !== 0) {
+				properties.x = x;
+			}
+			if (y !== 0) {
+				properties.y = y;
+			}
+
+			if (typeTool) {
+				let fontInfo = typeTool();
+				//const fonts = fontInfo.fonts();
+				//const styles = fontInfo.styles();
+				//const {RunLengthArray} = fontInfo.engineData.EngineDict.StyleRun;
+
+				properties.text = fontInfo.textValue;
+				const sizes = fontInfo.sizes();
+				const colors = fontInfo.colors();
+				properties.size = sizes ? sizes[0] || 20 : 20;
+				let [r, g, b, a] = colors[0];
+				properties.fillColor = `rgba(${r}, ${g}, ${b}, ${a / 255})`;
+				/*properties.textflow = {
+					fonts, styles, RunLengthArray,
+				};*/
+				viewNode.type = 'label';
+				dealLater = false;
+			} else if (solidColor) {
+				const {r, g, b} = solidColor();
+				let color = Color({r, g, b});
+
+				let paths = layer.vectorMask().paths;
+				if (paths[2].numPoints === 4) {
+					let isRect = true;
+					for (let i = 3; i < paths.length; i++) {
+						if (paths[i].recordType !== 2) {
+							isRect = false;
+							break;
+						}
+					}
+					if (isRect) {
+						viewNode.type = 'rect';
+						properties.fillColor = '#' + color.rgbNumber().toString(16);
+						dealLater = false;
+					}
+				}
+			}
+
+			if (dealLater) {
+				if (node.hasOwnProperty('children')) {
+					viewNode.type = 'node';
+				} else {
+					viewNode.type = 'image';
+
+					let uuid = generateUUID();
+					const ext = '.png';
+
+					let dataUrl;
+					try {
+						let img = node.origin.toPng();
+						dataUrl = img.src;
+					}catch (e) {
+
+					}
+
+					if (dataUrl) {
+						let base64Data = dataUrl.replace(/^data:image\/\w+;base64,/, "");
+						let buffer = new Buffer(base64Data, 'base64');
+						const fileNameHash = hash(buffer);
+						if (imageHashMap.hasOwnProperty(fileNameHash)) {
+							uuid = imageHashMap[fileNameHash];
+						} else {
+							imageHashMap[fileNameHash] = uuid;
+							assets.push({
+								name,
+								ext,
+								uuid,
+								base64Data,
+								hash: fileNameHash,
+							});
+						}
+
+						properties.source = 'asset://' + uuid;
+					}
+				}
+			}
+
+			let viewParent = parent.view || viewRoot;
+			if (!viewParent.hasOwnProperty('children')) {
+				viewParent.children = [];
+			}
+			viewParent.children.push(viewNode);
+
+			node.view = viewNode;
+		});
+
+		let data = {
+			view: viewRoot,
+			assets,
+		};
+
+		let dataString = JSON.stringify(data);
+		console.log(dataString.length);
+
+		let buf = new Buffer(dataString);
+		return await new Promise((resolve, reject)=>{
+			zlib.gzip(buf,function(err,res){
+				if(err){
+					reject(err);
+				}else{
+					console.log(res.length);
+					resolve(res);
+				}
+			});
+		})
+	}
+
+	exports.getTree = getTree;
+	exports.toZeroing = execute;
+
+	Object.defineProperty(exports, '__esModule', { value: true });
+
+}));
+//# sourceMappingURL=index.umd.js.map

package.json

+{
+  "name": "psd-parse-web",
+  "version": "1.0.0",
+  "main": "dist/index.js",
+  "module": "dist/index.es.js",
+  "license": "MIT",
+  "scripts": {
+    "build": "rollup -c"
+  },
+  "dependencies": {
+    "color": "^3.1.2",
+    "object-hash": "^2.0.1",
+    "uuid": "^3.3.3"
+  }
+}

psd-parse-web.iml

+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/dist" />
+    </content>
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
\ No newline at end of file

rollup.config.js

+/**
+ * Created by rockyl on 2018/11/16.
+ */
+
+const name = 'psd-parse-web';
+
+export default {
+	input: 'src/index.js',
+	output: [
+		{
+			file: `dist/index.js`,
+			format: 'cjs',
+			sourcemap: true,
+		},
+		{
+			file: `dist/index.es.js`,
+			format: 'es',
+			sourcemap: true,
+		},
+		{
+			file: `dist/index.umd.js`,
+			format: 'umd',
+			sourcemap: true,
+			name,
+		}
+	],
+	plugins: [
+
+	]
+};

src/index.js

+/**
+ * Created by rockyl on 2019-08-08.
+ */
+
+export {getTree} from "./psd-tree";
+
+export {execute as toZeroing} from "./zeroing";

src/psd-tree.js

+/**
+ * Created by rockyl on 2019-08-09.
+ */
+
+const PSD = window['require']('psd');
+
+export async function getTree(file) {
+	let psd = await PSD.fromDroppedFile(file);
+
+	const root = {};
+	walk(psd.tree(), root);
+
+	return root;
+}
+
+function walk(psNode, dataNode) {
+	const {left: pLeft = 0, top: pTop = 0,} = psNode.parent || {};
+	const {left, top, width, height, name, layer: {opacity, visible}} = psNode;
+	const x = left - pLeft;
+	const y = top - pTop;
+
+	Object.assign(dataNode, {x, y, width, height, alpha: opacity / 255, visible, name, origin: psNode, label: `${name} > [${x}, ${y}, ${width}, ${height}]`});
+	if (psNode.children() && psNode.children().length > 0){
+		dataNode.children = [];
+	}
+
+	let children = psNode.children();
+	for (let i = children.length - 1; i >= 0; i--) {
+		const childPsNode = children[i];
+
+		const childDataNode = {};
+		dataNode.children.push(childDataNode);
+		walk(childPsNode, childDataNode)
+	}
+}

src/utils.js

+/**
+ * Created by rockyl on 2019-08-10.
+ */
+
+export async function walkNode(node, callback, includeSelf = false) {
+	if (includeSelf) {
+		await callback(node, null);
+	}
+	if (node.children && node.children.length > 0) {
+		for (let childNode of node.children) {
+			await callback(childNode, node);
+			const result = await walkNode(childNode, callback);
+			if (result === true) {
+				break;
+			}
+		}
+	}
+}
+
+export async function walkObject(obj, callback) {
+	if(typeof obj === "object"){
+		for (let key of Object.keys(obj)) {
+			const value = obj[key];
+			await callback(key, value, obj);
+			const result = await walkObject(value, callback);
+			if (result === true) {
+				break;
+			}
+		}
+	}
+}

src/zeroing.js

+/**
+ * Created by rockyl on 2019-09-26.
+ *
+ * 导出zeroing的视图
+ */
+
+import {getTree} from "./psd-tree";
+import {walkNode} from "./utils";
+import path from 'path'
+import Color from 'color'
+import generateUUID from 'uuid/v4'
+import hash from 'object-hash';
+import zlib from 'zlib';
+
+export async function execute(psdFile, options) {
+	const tree = await getTree(psdFile);
+
+	let viewRoot = {
+		name: path.basename(psdFile.name, '.psd'),
+		type: 'node',
+		uuid: generateUUID(),
+	};
+
+	const assets = [];
+	const imageHashMap = {};
+
+	await walkNode(tree, async function (node, parent) {
+		const {name, x, y, width, height, alpha, visible, origin: {layer, layer: {typeTool, solidColor}}} = node;
+		console.log('walk node:', name);
+		let properties = {
+			width, height, alpha, visible,
+		};
+		let viewNode = {
+			name,
+			properties,
+			uuid: generateUUID(),
+		};
+		let dealLater = true;
+		if (x !== 0) {
+			properties.x = x;
+		}
+		if (y !== 0) {
+			properties.y = y;
+		}
+
+		if (typeTool) {
+			let fontInfo = typeTool();
+			//const fonts = fontInfo.fonts();
+			//const styles = fontInfo.styles();
+			//const {RunLengthArray} = fontInfo.engineData.EngineDict.StyleRun;
+
+			properties.text = fontInfo.textValue;
+			const sizes = fontInfo.sizes();
+			const colors = fontInfo.colors();
+			properties.size = sizes ? sizes[0] || 20 : 20;
+			let [r, g, b, a] = colors[0];
+			properties.fillColor = `rgba(${r}, ${g}, ${b}, ${a / 255})`;
+			/*properties.textflow = {
+				fonts, styles, RunLengthArray,
+			};*/
+			viewNode.type = 'label';
+			dealLater = false;
+		} else if (solidColor) {
+			const {r, g, b} = solidColor();
+			let color = Color({r, g, b});
+
+			let paths = layer.vectorMask().paths;
+			if (paths[2].numPoints === 4) {
+				let isRect = true;
+				for (let i = 3; i < paths.length; i++) {
+					if (paths[i].recordType !== 2) {
+						isRect = false;
+						break;
+					}
+				}
+				if (isRect) {
+					viewNode.type = 'rect';
+					properties.fillColor = '#' + color.rgbNumber().toString(16);
+					dealLater = false;
+				}
+			}
+		}
+
+		if (dealLater) {
+			if (node.hasOwnProperty('children')) {
+				viewNode.type = 'node';
+			} else {
+				viewNode.type = 'image';
+
+				let uuid = generateUUID();
+				const ext = '.png';
+
+				let dataUrl;
+				try {
+					let img = node.origin.toPng();
+					dataUrl = img.src;
+				}catch (e) {
+
+				}
+
+				if (dataUrl) {
+					let base64Data = dataUrl.replace(/^data:image\/\w+;base64,/, "");
+					let buffer = new Buffer(base64Data, 'base64');
+					const fileNameHash = hash(buffer);
+					if (imageHashMap.hasOwnProperty(fileNameHash)) {
+						uuid = imageHashMap[fileNameHash];
+					} else {
+						imageHashMap[fileNameHash] = uuid;
+						assets.push({
+							name,
+							ext,
+							uuid,
+							base64Data,
+							hash: fileNameHash,
+						});
+					}
+
+					properties.source = 'asset://' + uuid;
+				}
+			}
+		}
+
+		let viewParent = parent.view || viewRoot;
+		if (!viewParent.hasOwnProperty('children')) {
+			viewParent.children = [];
+		}
+		viewParent.children.push(viewNode);
+
+		node.view = viewNode;
+	});
+
+	let data = {
+		view: viewRoot,
+		assets,
+	};
+
+	let dataString = JSON.stringify(data);
+	console.log(dataString.length);
+
+	let buf = new Buffer(dataString);
+	return await new Promise((resolve, reject)=>{
+		zlib.gzip(buf,function(err,res){
+			if(err){
+				reject(err);
+			}else{
+				console.log(res.length);
+				resolve(res);
+			}
+		})
+	})
+}

yarn.lock

+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+
+color-convert@^1.9.1:
+  version "1.9.3"
+  resolved "https://registry.npm.taobao.org/color-convert/download/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8"
+  integrity sha1-u3GFBpDh8TZWfeYp0tVHHe2kweg=
+  dependencies:
+    color-name "1.1.3"
+
+color-name@1.1.3:
+  version "1.1.3"
+  resolved "https://registry.npm.taobao.org/color-name/download/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
+  integrity sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=
+
+color-name@^1.0.0:
+  version "1.1.4"
+  resolved "https://registry.npm.taobao.org/color-name/download/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
+  integrity sha1-wqCah6y95pVD3m9j+jmVyCbFNqI=
+
+color-string@^1.5.2:
+  version "1.5.3"
+  resolved "https://registry.npm.taobao.org/color-string/download/color-string-1.5.3.tgz#c9bbc5f01b58b5492f3d6857459cb6590ce204cc"
+  integrity sha1-ybvF8BtYtUkvPWhXRZy2WQziBMw=
+  dependencies:
+    color-name "^1.0.0"
+    simple-swizzle "^0.2.2"
+
+color@^3.1.2:
+  version "3.1.2"
+  resolved "https://registry.npm.taobao.org/color/download/color-3.1.2.tgz#68148e7f85d41ad7649c5fa8c8106f098d229e10"
+  integrity sha1-aBSOf4XUGtdknF+oyBBvCY0inhA=
+  dependencies:
+    color-convert "^1.9.1"
+    color-string "^1.5.2"
+
+is-arrayish@^0.3.1:
+  version "0.3.2"
+  resolved "https://registry.npm.taobao.org/is-arrayish/download/is-arrayish-0.3.2.tgz#4574a2ae56f7ab206896fb431eaeed066fdf8f03"
+  integrity sha1-RXSirlb3qyBolvtDHq7tBm/fjwM=
+
+object-hash@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.npm.taobao.org/object-hash/download/object-hash-2.0.1.tgz#cef18a0c940cc60aa27965ecf49b782cbf101d96"
+  integrity sha1-zvGKDJQMxgqieWXs9Jt4LL8QHZY=
+
+simple-swizzle@^0.2.2:
+  version "0.2.2"
+  resolved "https://registry.npm.taobao.org/simple-swizzle/download/simple-swizzle-0.2.2.tgz#a4da6b635ffcccca33f70d17cb92592de95e557a"
+  integrity sha1-pNprY1/8zMoz9w0Xy5JZLeleVXo=
+  dependencies:
+    is-arrayish "^0.3.1"
+
+uuid@^3.3.3:
+  version "3.3.3"
+  resolved "https://registry.npm.taobao.org/uuid/download/uuid-3.3.3.tgz#4568f0216e78760ee1dbf3a4d2cf53e224112866"
+  integrity sha1-RWjwIW54dg7h2/Ok0s9T4iQRKGY=