# File Structure Overview

A plugin is an installation package that contains multiple files and can be directly distributed to users.

<pre><code><strong>Plugin
</strong>├─ manifest.json
├─ logo.png
├─ index.html
└─ js
   └─ plugin.js
</code></pre>

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

***

## manifest.json <a href="#zqpdi" id="zqpdi"></a>

This is a file that every plugin must have. It contains basic information about the plugin, such as the plugin's name, version, code entry point, etc. There are different configuration methods for different types of plugins. The following is the basic configuration for a "window plugin":

```json
{
    "id": "LB5UL2P0Q9FFF",
    "version": "1.0.0",
    "name": "Hello World",
    "logo": "/logo.png",
    "keywords": ["keywrod1", "keywrod2"],
    "main":
    {
        "devTools": true,
        "url": "index.html",
        "width": 640,
        "height": 480
    }
}
```

* `id` - Plugin ID
* `version` - Plugin Version
* `name` - Plugin Name
* `logo` - Plugin Logo
* `keywords` - Plugin Keyword, In addition to the plugin name, users can also use these keywords to quickly search for the plugin.
* `main` - Plugin Window main entry
  * `url` - Entry Page
  * `width` - Window Width
  * `height` - Window Height

{% hint style="info" %}
**Note**: You can refer to [this article](/plugin-api/tutorial/manifest.md) to learn about all the configuration methods for manifest.json.
{% endhint %}

{% hint style="info" %}
**Example code**:

<https://github.com/eagle-app/eagle-plugin-examples/tree/main/Window>
{% endhint %}

## logo.png <a href="#pui04" id="pui04"></a>

The logo field in the manifest.json corresponds to the plugin's icon, which will be used in the plugin list and the plugin center. Please provide an image with a resolution of 128 x 128 pixels. The icon should generally be in PNG format, as PNG provides the best support for transparency.

***

## index.html <a href="#gmbp0" id="gmbp0"></a>

The main field in the manifest.json corresponds to the entry file of the plugin program. When the plugin is executed, index.html will be loaded independently and run in a separate browser window.


---

# 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/get-started/anatomy-of-an-extension.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.