#디렉토리 구조

Addfox는 convention over configuration 디자인 철학을 채택합니다. 표준 디렉토리 구조를 이해하면 빠르게 시작하고 best practice를 따를 수 있습니다.

#프로젝트 루트 디렉토리

전형적인 Addfox 프로젝트 구조는 다음과 같습니다:

my-extension/
├── .addfox/           # 빌드 출력 및 캐시 (자동 생성)
├── app/                # 애플리케이션 소스 코드 (설정 가능)
├── public/             # 정적 리소스
├── addfox.config.ts       # Addfox 설정 파일
└── package.json        # 프로젝트 의존성

#.addfox 디렉토리

.addfox는 프레임워크에서 자동 생성되며 다음을 포함합니다:

• extension/ — 기본 빌드 출력 디렉토리 (outDir로 수정 가능)
• cache/ — 빌드 캐시, 후속 빌드 가속에 사용

#app 디렉토리

app/은 기본 애플리케이션 소스 코드 디렉토리로 모든 extension entry와 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 페이지 HTML (선택)
│   └── index.ts          # options 페이지 script
├── sidepanel/
│   └── index.ts          # side panel
├── manifest/
│   ├── manifest.json           # 기본 설정
│   ├── manifest.chromium.json  # Chrome 오버라이드
│   └── manifest.firefox.json   # Firefox 오버라이드
└── ...

app/
├── background.ts         # background script
├── content.ts            # content script
├── popup.html            # popup 페이지
├── popup.ts              # popup script
├── manifest.json         # extension manifest
└── ...

#public 디렉토리

public/은 정적 리소스를 저장하는 데 사용되며, 빌드 시 출력 디렉토리로 그대로 복사되어 번들 처리되지 않습니다:

public/
├── icons/                # extension 아이콘
│   ├── icon16.png
│   ├── icon48.png
│   └── icon128.png
├── _locales/             # 국제화 파일
│   └── zh_CN/
│       └── messages.json
└── welcome.html          # 환영 페이지

#엔트리 유형

Addfox는 다음 내장 엔트리를 지원합니다:

#설정 파일

#addfox.config.ts / addfox.config.js

이것은 Addfox의 필수 설정 파일로 다음을 선언하는 데 사용됩니다:

• extension manifest
• 엔트리 파일 (entry)
• 출력 디렉토리 (outDir)
• Rsbuild 플러그인 및 설정

#최소 설정 예시

import { defineConfig } from "addfox";

export default defineConfig({
  // 설정을 생략하면 프레임워크가 app/에서 엔트리와 manifest를 자동으로 찾습니다
});

#관련 설정

• appDir — 애플리케이션 디렉토리 사용자 정의
• entry — 엔트리 수동 설정
• outDir — 출력 디렉토리 사용자 정의
• manifest — manifest 설정 방법