# 除錯插件

## 視窗插件除錯 <a href="#zqpdi" id="zqpdi"></a>

開啓插件後，點擊 `F12`鍵即可開啓 `DevTools` 除錯工具。

<figure><img src="/files/Idoh2jbouqilSCBqWeBG" alt=""><figcaption></figcaption></figure>

具體步驟如下：

1. 在 Eagle 中開啓您要除錯的插件，按下 `F12` 鍵，這將開啓 DevTools。
2. 在 DevTools 中，您可以查看插件的程式碼，並使用斷點、除錯工具來除錯插件的執行過程。
3. 您還可以使用 DevTools 中的其他工具來查看插件的效能、記憶體使用情況等資訊。

## 縮圖插件除錯

縮圖插件執行在背景，程式碼僅會在檔案新增、更新時被執行，如果你想要對縮圖功能程式碼進行除錯，你可以在 `manifest.json` 檔案中，將 `devTools` 屬性設定為 `true` ，並在程式碼設定 `debugger` 斷點，即可在 `devTools` 工具進行除錯工作。

## 預覽插件除錯

新增並選中你想要開發的檔案格式檔案到 Eagle 中，開啓插件面板，點擊你正在開發預覽插件，即可開啓一個獨立的預覽視窗，你可以點擊 `F12` 開啓 `DevTools` 進行除錯。

{% hint style="info" %}
瞭解更多：如果您不確定如何使用 DevTools，您可以查看下面這些學習資料來學習

1. Google 官方文件：<https://developers.google.com/web/tools/chrome-devtools>
2. MDN Web 文件：<https://developer.mozilla.org/zh-CN/docs/Tools>
3. W3Schools 教程：<https://www.w3schools.com/js/js_debugging.asp>
   {% endhint %}

## 日誌系統 <a href="#pui04" id="pui04"></a>

{% hint style="warning" %}
注意：預覽、縮圖插件目前不支援日誌 API。
{% endhint %}

日誌系統是一種用於記錄軟體執行狀態的工具，它可以幫助開發人員更快地定位和解決問題。日誌系統會記錄軟體的錯誤資訊、警告資訊、執行時間等資訊，可以作為一種除錯工具。在非開發環境下，日誌系統可以有效地幫助開發人員找出問題的原因，並採取措施解決問題。

Eagle Plugin API 提供了一種用於記錄插件執行資訊的 [log](/plugin-api/zh-tw/api/log.md) 功能，這樣，開發人員就可以將插件的執行、警告、錯誤等資訊記錄在 Eagle 的軟體日誌中。使用這種功能，只需向使用者提供除錯報告，就能查看到這些資訊。在開發插件時，使用日誌功能可以幫助開發人員快速定位和解決問題。

```javascript
eagle.log.debug('debug message from plugin');
eagle.log.info('info message from plugin');
eagle.log.warn('warn message from plugin');
eagle.log.error('error message from plugin');

// [13:19:39.845] [debug] [plugin] "debug message from plugin"
// [13:19:39.845] [info] [plugin] "info message from plugin"
// [13:19:39.845] [warn] [plugin] "warn message from plugin"
// [13:19:39.845] [error] [plugin] "error message from plugin"
```

{% hint style="info" %}
瞭解更多： [Log - API 參考](/plugin-api/zh-tw/api/log.md)
{% endhint %}

{% hint style="info" %}
點擊這裏查看 Eagle [軟體日誌](https://docs-cn.eagle.cool/article/92-how-do-i-get-the-error-log)取得方式。
{% 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/debugging.md?ask=<question>
```

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.