psd
Release 0.4.0
輕巧的Adobe Photoshop .psd/.psb文件解析器在打字稿中，Web瀏覽器和Nodejs零依賴性
@webtoon/psd是Adobe Photoshop PSD/PSB文件的快速，輕巧的解析器。它使用標準（ES2015+）功能，並且可以在Web瀏覽器和Node.js中使用。它的依賴性為零，使其比其他PSD解析器（AG-PSD：200 KIB，PSD.JS：443 KIB）更小（〜100 KIB縮小）。它使用WebAssembly加快解碼圖像數據。
| 鉻合金 | Firefox | 野生動物園 | 邊緣 | 節點 |
|---|---|---|---|---|
| 57 | 52 | 11 | 79 | 12 |
*不支持Internet Explorer
$ npm install @webtoon/psd您可以在瀏覽器中為 @webtoon/psd運行基準測試。
.psb ）@webtoon/psd作為純ecmasixt模塊提供。
查看Web瀏覽器的實時演示（源代碼）。
@webtoon/psd必須捆綁與bundler捆綁在一起，例如webpack或crolup。
@webtoon/psd將psd文件讀取為ArrayBuffer 。您可以使用FileReader或File加載PSD文件：
import Psd from "@webtoon/psd" ;
const inputEl : HTMLInputElement = document . querySelector ( "input[type='file']" ) ;
inputEl . addEventListener ( "change" , async ( ) => {
const file = inputEl . files [ 0 ] ;
const result = await file . arrayBuffer ( ) ;
const psdFile = Psd . parse ( result ) ;
const canvasElement = document . createElement ( "canvas" ) ;
const context = canvasElement . getContext ( "2d" ) ;
const compositeBuffer = await psdFile . composite ( ) ;
const imageData = new ImageData (
compositeBuffer ,
psdFile . width ,
psdFile . height
) ;
canvasElement . width = psdFile . width ;
canvasElement . height = psdFile . height ;
context . putImageData ( imageData , 0 , 0 ) ;
document . body . append ( canvasElement ) ;
} ) ;對於性能，我們建議在Web工作人員而不是主線程中解析PSD文件。
查看Web瀏覽器的node.js示例的源代碼。
@webtoon/psd不支持node.js Buffer 。您必須明確提供基礎ArrayBuffer 。
import * as fs from "fs" ;
import Psd from "@webtoon/psd" ;
const psdData = fs . readFileSync ( "./my-file.psd" ) ;
// Pass the ArrayBuffer instance inside the Buffer
const psdFile = Psd . parse ( psdData . buffer ) ;由於@webtoon/psd作為ES模塊提供，因此您必須使用Dynamic import()或Bundler在COMPORJS代碼中運行它：
const Psd = await import ( "@webtoon/psd" ) ; 該庫將Psd類作為默認導出。
Psd.parse(ArrayBuffer)採用一個包含PSD或PSB文件的ArrayBuffer ，並返回新的Psd對象。
const psdFile = Psd . parse ( myBuffer ) ;Psd對象包含Layer和Group （IE圖層組）對象的樹。
Psd對象提供了一個children屬性，該屬性是頂級Layer和Group s的數組。Group對像都提供一個children屬性，該屬性是屬於當前層組下方的Layers和Group S的數組。Psd ， Group和Layer對象提供了一個type字段，可用於區分每種類型： import Psd , { Node } from "@webtoon/psd" ;
// Recursively traverse layers and layer groups
function traverseNode ( node : Node ) {
if ( node . type === "Layer" ) {
// Do something with Layer
} else if ( node . type === "Group" ) {
// Do something with Group
} else if ( node . type === "Psd" ) {
// Do something with Psd
} else {
throw new Error ( "Invalid node type" ) ;
}
node . children ?. forEach ( ( child ) => traverseNode ( child ) ) ;
}
traverseNode ( psdFile ) ; Psd對像還提供layers屬性，該層是圖像中所有Layer的數組（包括嵌套）。
for ( const layer of psdFile . layers ) {
doSomething ( layer ) ;
}使用Psd.prototype.composite()和Layer.prototype.composite()來解碼整個圖像或單個圖層的像素信息。
請注意，要使Psd.prototype.composite()起作用，需要將PSD/PSB文件保存在“最大化兼容性”模式中。否則，它將不會返回數據。您可以在Preferences > File Handling > File Compatibility > Maximize PSD and PSB File Compatibility中啟用它
// Decode the pixel data of the entire image
pixelData = await psd . composite ( ) ;
// Extract the pixel data of a layer, with all layer and layer group effects applied
// (currently, only the opacity is supported)
layerPixelData = await layer . composite ( ) ;
// Extract the pixel data of a layer, with only the layer's own effects applied
layerPixelData = await layer . composite ( true , false ) ;
// Extract the pixel data of a layer, without any effects
layerPixelData = await layer . composite ( false ) ; @webtoon/psd根據MIT許可發布。
Copyright 2021-present NAVER WEBTOON
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
