Google Chrome 拡張機能でのローカル画像の読み込みのトラブルシューティング

Chrome 拡張機能内にローカル画像を組み込んでも、CSS を使用してローカル画像を表示するときに問題が発生します。この問題には対処する必要があります。

中心的な問題は、拡張機能アセットへの CSS 参照を許可する Chrome の i18n サポートにあります。これを解決するには、次の点を考慮してください:

1. 拡張機能内の「image」フォルダーに画像を配置します。
2. 次の構文を使用して CSS で画像を参照します:

background-image:url('chrome-extension://__MSG_@@extension_id__/images/main.png');

3. 参照された画像が「web_accessible_resources」配列にリストされていることを確認しますマニフェスト.json.

これらの手順を実装すると、Chrome 拡張機能内で CSS を使用してローカル画像を正常に読み込んで表示できるようになります。