에지(Edge) 브라우저에서 확장 프로그램의 기본 폴더 구조는 크롬(Chrome) 브라우저와 매우 유사합니다. 기본적으로 확장 프로그램 폴더는 다음과 같은 파일과 폴더로 구성됩니다.
cssmy_extension/
├── manifest.json
├── background/
│ └── background.js
├── content/
│ └── content.js
├── popup/
│ ├── index.html
│ └── popup.js
└── icons/
├── icon16.png
├── icon32.png
├── icon48.png
├── icon128.png
└── icon256.png
위 구조에서 my_extension
은 확장 프로그램의 이름입니다. 여기서 각 파일과 폴더의 역할은 다음과 같습니다.
manifest.json
: 확장 프로그램의 메타데이터가 포함된 파일입니다.background/
: 확장 프로그램의 백그라운드 페이지를 구현하는 파일이 위치하는 폴더입니다.background/background.js
: 백그라운드 페이지에 대한 JavaScript 코드가 포함된 파일입니다.content/
: 확장 프로그램의 컨텐츠 스크립트를 구현하는 파일이 위치하는 폴더입니다.content/content.js
: 컨텐츠 스크립트에 대한 JavaScript 코드가 포함된 파일입니다.popup/
: 확장 프로그램의 팝업 페이지를 구현하는 파일이 위치하는 폴더입니다.popup/index.html
: 팝업 페이지의 HTML 코드가 포함된 파일입니다.popup/popup.js
: 팝업 페이지에 대한 JavaScript 코드가 포함된 파일입니다.icons/
: 확장 프로그램의 아이콘 파일이 위치하는 폴더입니다.위 폴더 구조는 단순한 예시이며, 더 복잡한 확장 프로그램에서는 다양한 파일과 폴더를 사용할 수 있습니다. 따라서 위 구조를 참고하여 필요한 파일과 폴더를 추가하고, manifest.json
파일을 수정하여 확장 프로그램을 구성할 수 있습니다.