見出し画像

Chrome拡張の入れ方ガイド（ストア非公開版）│デベロッパーモード

深夜ラテ｜AI×ブレンド

この記事では、自作や配布されたChrome拡張をブラウザに登録する方法を解説します。 Chrome ウェブストアには公開していないため、少し手順が必要ですが、一度設定すればあとはそのまま使い続けられます。

Chrome ウェブストアを使わずに、自作の拡張機能（未パッケージ）を Chrome に入れる方法をまとめました。 初めての方でも迷わないよう、保存場所のおすすめもあわせて解説します。


そもそも「デベロッパーモード」とは？

Chrome には、公式ストアを経由せずにローカルのファイルを直接拡張として読み込む機能があります。 これを使うのが デベロッパーモード です。

自分で作った拡張を試したい・配布前に動作確認したい、そんなときに必須の機能です。

STEP 1：デベロッパーモードをオンにする

  1. Chrome のアドレスバーに chrome://extensions と入力して開く

  2. 右上の 「デベロッパー モード」 トグルをオンにする

画像はオフの状態です。

右上のトグルをオンにすると3つのボタンが追加される

オンにすると、画面上部に以下の3つのボタンが表示されます。

ボタン 用途 パッケージ化されていない拡張機能を読み込む ローカルフォルダを拡張として登録 拡張機能をパッケージ化 .crx ファイルの作成 更新 登録済み拡張を一括リロード

STEP 2：拡張ファイルの保存場所を決める

読み込む前に、ファイルの置き場所を決めておくのが重要です。 後から移動すると Chrome の登録が切れてしまいます。

✅ おすすめの保存場所

Windows の場合

C:\Users\[ユーザー名]\dev\chrome-extensions\
  └── my-extension\
        ├── manifest.json
        ├── background.js
        ├── popup.html
        └── icons\

Mac の場合

~/dev/chrome-extensions/
  └── my-extension/
        ├── manifest.json
        ├── background.js
        └── ...

📁 ダウンロードフォルダについて

「絶対に消さない自信がある！」という方は、ダウンロードフォルダでも動作します。 ただし推奨はしません。理由は以下のとおりです。

ダウンロードフォルダ 整理されず埋もれやすい・誤削除のリスクあり（動作はする） デスクトップ 散らかりやすく長期管理に向かない クラウド同期フォルダ（OneDrive など） 同期タイミングによってファイルが壊れることがある

フォルダを移動・削除すると Chrome の登録が切れてしまいます。「あれ、消えた」となる原因のほとんどがこれです。専用フォルダに固定しておくのが一番トラブルが少ないです。

STEP 3：拡張を Chrome に読み込む

  1. chrome://extensions を開く

  2. 「パッケージ化されていない拡張機能を読み込む」 をクリック

  3. 拡張のフォルダ（manifest.json が入っているフォルダ）を選択

  4. 一覧にカードが表示されれば完了

【参考例】
ZIPを展開すると以下の構造になります。

xxx拡張アプリ名xxx-ext/        ← ★ このフォルダを選ぶ
  ├── manifest.json
  ├── content.js
  ├── background.js
  ├── popup.html
  ├── popup.js
  ├── options.html
  ├── options.js
  └── icons/

選ぶのは xxx拡張アプリ名xxx-ext フォルダです。 manifest.json が入っているフォルダがそれです。

ポイント：選ぶのは「フォルダ」です。manifest.json ファイル自体を選ばないよう注意。

STEP 4：ファイルを更新したあとのリロード方法

ご自身でコードを変更した等のあとは、Chrome に反映させるためにリロードが必要です。

方法 A：拡張カードの更新ボタン

chrome://extensions を開いて、対象の拡張カードにある 🔄（更新）アイコン をクリック。

方法 B：全体を一括更新

画面上部の 「更新」 ボタンで、登録されているすべての拡張をまとめてリロード。

よくあるトラブルと対処法

【症状 ・原因・対処】
・読み込んだはずの拡張が消えた
　↳フォルダを移動・削除した

・元の場所に戻して再登録 コードを変えても反映されない
　↳リロードを忘れている 🔄 ボタンを押す

・「マニフェストが見つかりません」エラー
　↳フォルダ選択が一段ずれている manifest.json があるフォルダを選ぶ

まとめ

  1. chrome://extensions でデベロッパーモードをオン

  2. ファイルは任意の場所に固定して置く

  3. 「パッケージ化されていない拡張機能を読み込む」でフォルダを選択

  4. コード変更後は 🔄 ボタンでリロード

この記事が役に立ったら、ぜひシェアしてください。



#Chrome拡張 #GoogleChrome #拡張機能 #デベロッパーモード #AIツール #作業効率化 #生産性向上 #ブラウザ拡張 #Chrome便利機能 #PC効率化 #AI活用 #Webツール #自作Chrome拡張 #開発者モード #Chrome設定 #ChatGPT #Gemini #Claude #ノーコード #デジタルツール



読んでくれてありがとうございます。次の記事でまた。

いいなと思ったら応援しよう！