WXTでスクリプトを挿入する方法

背景

Chrome拡張機能開発をtypescriptで行いたいので、wxtというフレームワークらしきものを使っていた。
chrome.scripting.executeScript()APIを用いてウェブページにスクリプトを挿入でき、それをwxtでも行いたかったが挿入されない場合があった。

挿入方法

ブラウザAPI

WXT公式ドキュメント Scripting

公式の例

// entrypoints/background.ts
const res = await browser.scripting.executeScript({
 target: { tabId },
 files: ['content-scripts/example.js'],
});
console.log(res); // "Hello John!"

~~/example.jsとあるが、どのようなルールによって指定しているのだろうか。

挿入するスクリプトの書き方

WXT公式ドキュメント Unlisted Scripting

entrypoints/{name}.[jt]sx? -> /{name}.js

entrypoints/{name}/index.[jt]sx? -> /{name}.js

{name}.jsでアクセスできる。

挿入するスクリプトはこのようにする必要がある

公式の例

export default defineUnlistedScript(() => {
 // Executed when script is loaded
});