크롬 확장프로그램 개발은 js, html, 그리고 Manifest File 구성되어 개발이 된다.

 

크롬 확장 프로그램에 필요한 js, html 그리고 Manifest file 하나의 폴더에 두고,

 

크롬을 실행하여 주소입력창에 chrome://extensions 입력하면, 확장프로그램 페이지로 이동한다.

 

개발자 모드(Developer mode) 켜주면, 숨겨진 바가 나온다. 


거기서 "압축해제된 확장 프로그램을 로드합니다.(Load unpacked)" 클릭하면,

 

폴더를 선택할 있는 창이 나온다


여기서 크롬 확장프로그램에 필요한 파일들이 들어있는 폴더를 선택하면 된다.

 

그러면 크롬에 확장 프로그램이 추가된다.

 

크롬 확장 프로그램에서 manifest.json 파일 설정에 따라 필요한 js,html 있으므로


간단하게 작성해 보면 아래와 같다.

 

{

"name": "Tutorial",

"version": "1.0",

"description": "run to Simple",

"permissions":      ["storage","notifications"],

"background": {

"scripts": ["background.js"],

"persistent": false

},

"browser_action": {

"default_popup":"popup.html"

},

"manifest_version": 2

}

 

manifest.json에서 필수로 선언되어야 하는 내용은 name, version, manifest_version 3가지 이고,


manifest_version 2 설정해야된다.

 

상세 내용은 공식 홈페이지 참조 (https://developer.chrome.com/extensions/manifest)

 

위와 같이 설정을 하게 되면 필요한 파일은

 

- Background.js

- popup.html

- popup.js ( popup.html 내에서 사용될 자바스크립 )

 

추가적으로 ajax selector 사용하기 위하여 옵션적으로 jQuery.js 파일을 추가해서 사용해도 된다.





'프로그래밍 > Chrome Extension' 카테고리의 다른 글

크롬 확장프로그램 tutorial 2  (0) 2019.03.24