修复色块颜色值的问题，

增加相对坐标的解析

dist/index.es.js

 import path from 'path';
-import Color from 'color';
+import 'color';
 import generateUUID from 'uuid/v4';
 import hash from 'object-hash';
 import zlib from 'zlib';
@@ -72,8 +72,12 @@ const relativePosPrefixMap = {
 	b: {field: 'bottom',},
 	h: {field: 'horizonCenter',},
 	v: {field: 'verticalCenter',},
-	wp: {field: 'width', isPercent: true},
-	hp: {field: 'height', isPercent: true},
+	wp: {field: 'width', },
+	hp: {field: 'height', },
+	lp: {field: 'left', },
+	tp: {field: 'top', },
+	rp: {field: 'right', },
+	bp: {field: 'bottom', },
 };
 
 async function execute(psdFile, options) {
@@ -88,6 +92,8 @@ async function execute(psdFile, options) {
 	const assets = [];
 	const imageHashMap = {};
 
+	const {width: stageWidth, height: stageHeight} = tree;
+
 	await walkNode(tree, async function (node, parent) {
 		let {name} = node;
 		const {x, y, width, height, alpha, visible, origin: {layer, layer: {typeTool, solidColor}}} = node;
@@ -113,9 +119,47 @@ async function execute(psdFile, options) {
 						let prefix = result[0];
 						let mapItem = relativePosPrefixMap[prefix];
 						if (mapItem) {
-							const {field, isPercent} = mapItem;
+							let {field,} = mapItem;
 							let value = item.substr(prefix.length);
+							let hasValue = value.length > 0;
+							let fieldChar = prefix[0];
+							if(!hasValue){
+								switch(fieldChar){
+									case 'l':
+										value = x;
+										break;
+									case 't':
+										value = y;
+										break;
+									case 'r':
+										value = stageWidth - width;
+										break;
+									case 'b':
+										value = stageHeight - height;
+										break;
+									case 'h':
+										value = x + width / 2 - stageWidth / 2;
+										break;
+									case 'v':
+										value = y + height / 2 - stageHeight / 2;
+										break;
+								}
+							}
+							let isPercent = prefix.endsWith('p');
 							if (isPercent) {
+								if(!hasValue){
+									switch(fieldChar){
+										case 'l':
+										case 'r':
+											value /= stageWidth;
+											break;
+										case 't':
+										case 'b':
+											value /= stageHeight;
+											break;
+									}
+									value = Math.floor(value * 100);
+								}
 								value += '%';
 							} else {
 								value = parseFloat(value);
@@ -156,8 +200,6 @@ async function execute(psdFile, options) {
 			viewNode.type = 'label';
 			dealLater = false;
 		} else if (solidColor && layer.vectorMask) {
-			const {r, g, b} = solidColor();
-			let color = Color({r, g, b});
 
 			let paths = layer.vectorMask().paths;
 			if (paths[2].numPoints === 4) {
@@ -170,7 +212,8 @@ async function execute(psdFile, options) {
 				}
 				if (isRect) {
 					viewNode.type = 'rect';
-					properties.fillColor = '#' + color.rgbNumber().toString(16);
+					const {r, g, b} = solidColor();
+					properties.fillColor = `rgba(${r}, ${g}, ${b}, 1)`;
 					dealLater = false;
 				}
 			}

dist/index.js

@@ -5,7 +5,7 @@ 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'));
+require('color');
 var generateUUID = _interopDefault(require('uuid/v4'));
 var hash = _interopDefault(require('object-hash'));
 var zlib = _interopDefault(require('zlib'));
@@ -78,8 +78,12 @@ const relativePosPrefixMap = {
 	b: {field: 'bottom',},
 	h: {field: 'horizonCenter',},
 	v: {field: 'verticalCenter',},
-	wp: {field: 'width', isPercent: true},
-	hp: {field: 'height', isPercent: true},
+	wp: {field: 'width', },
+	hp: {field: 'height', },
+	lp: {field: 'left', },
+	tp: {field: 'top', },
+	rp: {field: 'right', },
+	bp: {field: 'bottom', },
 };
 
 async function execute(psdFile, options) {
@@ -94,6 +98,8 @@ async function execute(psdFile, options) {
 	const assets = [];
 	const imageHashMap = {};
 
+	const {width: stageWidth, height: stageHeight} = tree;
+
 	await walkNode(tree, async function (node, parent) {
 		let {name} = node;
 		const {x, y, width, height, alpha, visible, origin: {layer, layer: {typeTool, solidColor}}} = node;
@@ -119,9 +125,47 @@ async function execute(psdFile, options) {
 						let prefix = result[0];
 						let mapItem = relativePosPrefixMap[prefix];
 						if (mapItem) {
-							const {field, isPercent} = mapItem;
+							let {field,} = mapItem;
 							let value = item.substr(prefix.length);
+							let hasValue = value.length > 0;
+							let fieldChar = prefix[0];
+							if(!hasValue){
+								switch(fieldChar){
+									case 'l':
+										value = x;
+										break;
+									case 't':
+										value = y;
+										break;
+									case 'r':
+										value = stageWidth - width;
+										break;
+									case 'b':
+										value = stageHeight - height;
+										break;
+									case 'h':
+										value = x + width / 2 - stageWidth / 2;
+										break;
+									case 'v':
+										value = y + height / 2 - stageHeight / 2;
+										break;
+								}
+							}
+							let isPercent = prefix.endsWith('p');
 							if (isPercent) {
+								if(!hasValue){
+									switch(fieldChar){
+										case 'l':
+										case 'r':
+											value /= stageWidth;
+											break;
+										case 't':
+										case 'b':
+											value /= stageHeight;
+											break;
+									}
+									value = Math.floor(value * 100);
+								}
 								value += '%';
 							} else {
 								value = parseFloat(value);
@@ -162,8 +206,6 @@ async function execute(psdFile, options) {
 			viewNode.type = 'label';
 			dealLater = false;
 		} else if (solidColor && layer.vectorMask) {
-			const {r, g, b} = solidColor();
-			let color = Color({r, g, b});
 
 			let paths = layer.vectorMask().paths;
 			if (paths[2].numPoints === 4) {
@@ -176,7 +218,8 @@ async function execute(psdFile, options) {
 				}
 				if (isRect) {
 					viewNode.type = 'rect';
-					properties.fillColor = '#' + color.rgbNumber().toString(16);
+					const {r, g, b} = solidColor();
+					properties.fillColor = `rgba(${r}, ${g}, ${b}, 1)`;
 					dealLater = false;
 				}
 			}

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';
+	(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;
+	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;
@@ -78,8 +78,12 @@
 		b: {field: 'bottom',},
 		h: {field: 'horizonCenter',},
 		v: {field: 'verticalCenter',},
-		wp: {field: 'width', isPercent: true},
-		hp: {field: 'height', isPercent: true},
+		wp: {field: 'width', },
+		hp: {field: 'height', },
+		lp: {field: 'left', },
+		tp: {field: 'top', },
+		rp: {field: 'right', },
+		bp: {field: 'bottom', },
 	};
 
 	async function execute(psdFile, options) {
@@ -94,6 +98,8 @@
 		const assets = [];
 		const imageHashMap = {};
 
+		const {width: stageWidth, height: stageHeight} = tree;
+
 		await walkNode(tree, async function (node, parent) {
 			let {name} = node;
 			const {x, y, width, height, alpha, visible, origin: {layer, layer: {typeTool, solidColor}}} = node;
@@ -119,9 +125,47 @@
 							let prefix = result[0];
 							let mapItem = relativePosPrefixMap[prefix];
 							if (mapItem) {
-								const {field, isPercent} = mapItem;
+								let {field,} = mapItem;
 								let value = item.substr(prefix.length);
+								let hasValue = value.length > 0;
+								let fieldChar = prefix[0];
+								if(!hasValue){
+									switch(fieldChar){
+										case 'l':
+											value = x;
+											break;
+										case 't':
+											value = y;
+											break;
+										case 'r':
+											value = stageWidth - width;
+											break;
+										case 'b':
+											value = stageHeight - height;
+											break;
+										case 'h':
+											value = x + width / 2 - stageWidth / 2;
+											break;
+										case 'v':
+											value = y + height / 2 - stageHeight / 2;
+											break;
+									}
+								}
+								let isPercent = prefix.endsWith('p');
 								if (isPercent) {
+									if(!hasValue){
+										switch(fieldChar){
+											case 'l':
+											case 'r':
+												value /= stageWidth;
+												break;
+											case 't':
+											case 'b':
+												value /= stageHeight;
+												break;
+										}
+										value = Math.floor(value * 100);
+									}
 									value += '%';
 								} else {
 									value = parseFloat(value);
@@ -162,8 +206,6 @@
 				viewNode.type = 'label';
 				dealLater = false;
 			} else if (solidColor && layer.vectorMask) {
-				const {r, g, b} = solidColor();
-				let color = Color({r, g, b});
 
 				let paths = layer.vectorMask().paths;
 				if (paths[2].numPoints === 4) {
@@ -176,7 +218,8 @@
 					}
 					if (isRect) {
 						viewNode.type = 'rect';
-						properties.fillColor = '#' + color.rgbNumber().toString(16);
+						const {r, g, b} = solidColor();
+						properties.fillColor = `rgba(${r}, ${g}, ${b}, 1)`;
 						dealLater = false;
 					}
 				}

src/zeroing.js

@@ -19,8 +19,12 @@ const relativePosPrefixMap = {
 	b: {field: 'bottom',},
 	h: {field: 'horizonCenter',},
 	v: {field: 'verticalCenter',},
-	wp: {field: 'width', isPercent: true},
-	hp: {field: 'height', isPercent: true},
+	wp: {field: 'width', },
+	hp: {field: 'height', },
+	lp: {field: 'left', },
+	tp: {field: 'top', },
+	rp: {field: 'right', },
+	bp: {field: 'bottom', },
 };
 
 export async function execute(psdFile, options) {
@@ -35,6 +39,8 @@ export async function execute(psdFile, options) {
 	const assets = [];
 	const imageHashMap = {};
 
+	const {width: stageWidth, height: stageHeight} = tree;
+
 	await walkNode(tree, async function (node, parent) {
 		let {name} = node;
 		const {x, y, width, height, alpha, visible, origin: {layer, layer: {typeTool, solidColor}}} = node;
@@ -43,6 +49,8 @@ export async function execute(psdFile, options) {
 			width, height, alpha, visible,
 		};
 
+		const {width: parentWidth, height: parentHeight} = parent;
+
 		if (name.includes('|')) {
 			try {
 				let arr = name.split('|');
@@ -60,9 +68,47 @@ export async function execute(psdFile, options) {
 						let prefix = result[0];
 						let mapItem = relativePosPrefixMap[prefix];
 						if (mapItem) {
-							const {field, isPercent} = mapItem;
+							let {field,} = mapItem;
 							let value = item.substr(prefix.length);
+							let hasValue = value.length > 0;
+							let fieldChar = prefix[0];
+							if(!hasValue){
+								switch(fieldChar){
+									case 'l':
+										value = x;
+										break;
+									case 't':
+										value = y;
+										break;
+									case 'r':
+										value = stageWidth - width;
+										break;
+									case 'b':
+										value = stageHeight - height;
+										break;
+									case 'h':
+										value = x + width / 2 - stageWidth / 2;
+										break;
+									case 'v':
+										value = y + height / 2 - stageHeight / 2;
+										break;
+								}
+							}
+							let isPercent = prefix.endsWith('p');
 							if (isPercent) {
+								if(!hasValue){
+									switch(fieldChar){
+										case 'l':
+										case 'r':
+											value /= stageWidth;
+											break;
+										case 't':
+										case 'b':
+											value /= stageHeight;
+											break;
+									}
+									value = Math.floor(value * 100);
+								}
 								value += '%';
 							} else {
 								value = parseFloat(value);
@@ -103,8 +149,6 @@ export async function execute(psdFile, options) {
 			viewNode.type = 'label';
 			dealLater = false;
 		} else if (solidColor && layer.vectorMask) {
-			const {r, g, b} = solidColor();
-			let color = Color({r, g, b});
 
 			let paths = layer.vectorMask().paths;
 			if (paths[2].numPoints === 4) {
@@ -117,7 +161,8 @@ export async function execute(psdFile, options) {
 				}
 				if (isRect) {
 					viewNode.type = 'rect';
-					properties.fillColor = '#' + color.rgbNumber().toString(16);
+					const {r, g, b} = solidColor();
+					properties.fillColor = `rgba(${r}, ${g}, ${b}, 1)`;
 					dealLater = false;
 				}
 			}