# 格式擴充
格式擴充插件的主要目的是使 Eagle 能夠預覽尚未支援的檔案格式。與其他類型插件不同，格式擴充插件在 `manifest.json` 中不需要定義 `main` 屬性，而是需要設定 `preview` 屬性。以下是一個範例程式碼：
```json
"preview": {}
```
在 `preview` 中可以定義要擴充的檔案副檔名。例如，如果想要讓 Eagle 支援 icns 圖示格式，可以輸入 `"icns": {}`：
```json
"preview" : {
"icns": {}
}
```
另外，如果你需要同時設定多個副檔名，你可以使用 , 將不同副檔名隔開進行定義，比如：
```json
"preview" : {
"icns,ico": {}
}
```
格式擴充插件可以分成兩個部分：
1. `"thumbnail.path"`：提供用於解析要擴充的檔案格式的縮圖的 `.js` 檔案。
2. `"viewer.path"`：提供用於預覽要擴充的格式的 `.html` 檔案。
```json
"preview": {
"icns": {
"thumbnail": {
"path": "thumbnail/icns.js",
"size": 400,
"allowZoom": false
},
"viewer": {
"path": "viewer/icns.html"
}
}
}
```
設定其它 `metadata.json` 欄位後，最終程式碼如下：
{% tabs %}
{% tab title="manifest.json" %}
```json
{
"id": "LARSKLB8OTOC2",
"version": "1.0.0",
"platform": "all",
"arch": "all",
"name": "Preview Plugin",
"logo": "/logo.png",
"keywords": [
"icns"
],
"devTools": false,
"preview": {
"icns": {
"thumbnail": {
"path": "thumbnail/icns.js",
"size": 400,
"allowZoom": false
},
"viewer": {
"path": "viewer/icns.html"
}
}
}
}
```
{% endtab %}
{% tab title="thumbnail/icns.js" %}
```javascript
const fs = require('fs');
const icns = require('./../js/icns-util.js');
const imageSize = require('./../js/image-size.js');
module.exports = async ({ src, dest, item }) => {
return new Promise(async (resolve, reject) => {
try {
// 1. parsing and generate thumbnail file to dest
await icns.icns2png(src, dest);
let size = await imageSize(dest);
// 2. Check if the result is correct
if (!fs.existsSync(dest) || size.width === 0) {
return reject(new Error(`icns file thumbnail generate fail.`));
}
// 3. update the item dimensions
item.height = size?.height || item.height;
item.width = size?.width || item.width;
// 4. return the result
return resolve(item);
}
catch (err) {
return reject(err);
}
});
}
```
{% endtab %}
{% tab title="viewer/icns.html" %}
```html
ICNS Viewer
![]()
```
{% endtab %}
{% endtabs %}
{% hint style="warning" %}
請注意，目前格式擴充插件不支援 Eagle Plugin API 和 DevTools 除錯功能。
{% endhint %}
{% hint style="info" %}
**完整範例程式碼：**\
{% endhint %}
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://developer.eagle.cool/plugin-api/zh-tw/get-started/plugin-types/preview.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.