chrome extensionの書き方メモ

なぜ

このアドレスバーにツイッター共有ページを開くボタンを設置するだけのchrome extensionを書いたときに調べたことをメモしておく

github.com

メモ

manifest.json

chrome extensionには設定ファイルであるmanifest.jsonが必須

実際に書いたもの

{
    "manifest_version": 2,
    "name": "twitter share button",
    "version": "0.0.0.1",
    "description": "Put twitter share button on address bar.",
    "icons": {
        "16": "img/Twitter.png",
        "48": "img/Twitter.png",
        "128": "img/Twitter.png"
    },
    "browser_action": {
        "default_title": "twitter share",
        "default_icon": {
            "19": "img/Twitter.png"
        }
    },
    "permissions": [
        "tabs",
        "http://*/*",
        "https://*/*"
    ],
    "background": {
        "scripts": [
            "src/background.js"
        ],
        "persistent": false
    },
    "content_scripts": [
        {
            "matches": [
                "<all_urls>"
            ],
            "js": [
                "src/script.js"
            ]
        }
    ]
}

アドレスバーに設置するextensionの時は"blowser_action"のほうを使う

アイコンは大きいサイズのものを指定すると縮小される

background.js/script.js

background.jsでtabにmessageを送るevent listenerを登録して、script.jsでmessageを受け取り関数を呼ぶ

script.jsでchrome.browserAction.onClicked.addListenerを実行してもonClickedが無いと言われ動かない