Структура директорий

Addfox следует философии "соглашение важнее конфигурации". Понимание стандартной структуры директорий поможет вам быстро начать работу и следовать best practices.

Корневая директория проекта

Типичная структура проекта Addfox выглядит так:

my-extension/
├── .addfox/           # Выходные файлы сборки и кэш (автоматически генерируется)
├── app/                # Исходный код приложения (настраивается)
├── public/             # Статические ресурсы
├── addfox.config.ts       # Конфигурационный файл Addfox
└── package.json        # Зависимости проекта

Директория .addfox

.addfox автоматически генерируется фреймворком и содержит:

  • extension/ — директория выходных файлов сборки по умолчанию (можно изменить через outDir)
  • cache/ — кэш сборки для ускорения последующих сборок
Tip

Не удаляйте директорию cache без необходимости, иначе это повлияет на скорость сборки и повторное использование пользовательских данных браузера.

Директория app

app/ — это директория исходного кода приложения по умолчанию, содержащая все entry points расширения и файлы manifest. Можно изменить через опцию конфигурации appDir:

// addfox.config.ts
export default defineConfig({
  appDir: "src",  // изменение на директорию src
});

Рекомендуемая структура директорий

Многофайловая структура (рекомендуется)
Однофайловая структура
app/
├── background/
│   └── index.ts          # Service Worker / Background script
├── content/
│   └── index.ts          # Content script
├── popup/
│   ├── index.html        # Popup HTML (опционально)
│   └── index.ts          # Popup script
├── options/
│   ├── index.html        # Options page HTML (опционально)
│   └── index.ts          # Options page script
├── sidepanel/
│   └── index.ts          # Side panel
├── manifest/
│   ├── manifest.json           # Базовая конфигурация
│   ├── manifest.chromium.json  # Переопределение для Chrome
│   └── manifest.firefox.json   # Переопределение для Firefox
└── ...
Info

Подробнее о правилах обнаружения entry points см. File-based entry и конфигурация entry.

Директория public

public/ используется для статических ресурсов, которые копируются в выходную директорию без изменений и не обрабатываются сборщиком:

public/
├── icons/                # Иконки расширения
│   ├── icon16.png
│   ├── icon48.png
│   └── icon128.png
├── _locales/             # Файлы локализации
│   └── zh_CN/
│       └── messages.json
└── welcome.html          # Страница приветствия

Типы entry points

Addfox поддерживает следующие встроенные типы entry points:

Имя entry pointТипОписаниеГенерирует HTML
backgroundТолько скриптService Worker / Background scriptНет
contentТолько скриптContent scriptНет
popupСкрипт+страницаToolbar popupДа
optionsСкрипт+страницаOptions страница расширенияДа
sidepanelСкрипт+страницаSide panelДа
devtoolsСкрипт+страницаDevToolsДа
offscreenСкрипт+страницаOffscreen documentДа
Warning

Имена встроенных entry points нельзя изменить, Addfox использует их для автоматического распознавания.

Конфигурационные файлы

addfox.config.ts / addfox.config.js

Это обязательный конфигурационный файл Addfox, используемый для объявления:

  • Extension manifest
  • Entry files
  • Выходной директории (outDir)
  • Rsbuild плагинов и конфигурации

Минимальный пример конфигурации

import { defineConfig } from "addfox";

export default defineConfig({
  // При отсутствии конфигурации фреймворк автоматически обнаружит entry points и manifest из app/
});

Связанная конфигурация

  • appDir — настройка директории приложения
  • entry — ручная настройка entry points
  • outDir — настройка выходной директории
  • manifest — способы конфигурации manifest