「Chrome拡張機能」を作ってみよう！必要なファイル「manifest.json」について解説！

みなさんこんにちは！おさかなです！

今回は「manifest.json」について、書いていこうと思います！

それでは、レッツゴー！！！！！

はじめに

今回は「Chrome拡張機能」を作るときに必要な、最初につくるファイル「manifest.json」の解説をしていきたいと思います！

※「Chrome拡張機能作りの流れ」を知りたい方はコチラ！(準備中)

「manifest.json」ファイルって何？

「manifest.json」とは、かんたんに言うと「Chrome拡張機能の概要」を記したファイルになります！(なるほど…！)

形式は「JavaScriptのオブジェクト形式」である、「JSON形式」というもので書いていくことになります！
あまり聞きなれない形式ですが、次項で1つ1つ解説していくので安心してください…！

ファイルの階層としては、「HTMLファイル」と「同じ階層」に作成すれば大丈夫です！

「manifest.json」のソースコード解説！

{
	"manifest_version": 2,
	"name": "Hello!",
	"version": "1.0",

	"browser_action": {
		"default_icon": {
		"16": "icon.png"
		},
		"default_popup": "index.html"
}

必須項目

"manifest_version": "ここにバージョンの数字を入力",

「manifest.json」自体のバージョン

"name": "ここにChrome拡張機能の名前を入力",

「Chrome拡張機能の名前」の設定

"version": "1.0",

「Chrome拡張機能」自体のバージョン
(はじめて作成する方は1.0で大丈夫だと思います！)

機能に応じた項目

"browser_action": {
		"default_icon": {
		"アイコン画像のサイズ": "アイコン画像の指定"
		},

アイコン画像を指定します。
(アイコンの画像サイズは基本的に16×16で問題ないと思います。)

"default_popup": "表示させたいポップアップの中身のファイルを指定"

アイコンをクリックしたら表示される「ポップアップ」の中身のファイル(HTMLファイル)を指定することが出来ます。

【Chrome拡張機能をつくってみよう！】ファイルのアップロード方法！

みなさんこんにちは！おさかなです！ 今回は「Chrome拡張機能の作り方」の中でも「ファイルのアップロード方法」について、書いていこうと思います！ それでは、レッツゴー！！！！！ 想定読者 ・「Chrome拡張機能」を作って...

osakanav.com

2020.01.08

感想・まとめ

今回は「manifest.json」について、書いていきました…！

いかがだったでしょうか？

「Chrome拡張機能」を作るとき、あまり見ないファイルを作成したりするので最初は戸惑うかもしれませんが、慣れればそんなに難しくないので、おさかなと一緒に丁寧にチャレンジしていきましょう～！

(おさかなも頑張ります…！)

それでは今回はこの辺で！

ここまで読んでくださり、ありがとうございました！

おさかなでした！