そのためにはこういう用意があればよいというメモです。
いちおうTSだけなら公式からもテンプレが出てるので、それを使うのが手っ取り早い。
けど、`webpack`しかないし他にもいろいろ付いてくるしな〜という。
GitHub - cloudflare/worker-typescript-template: ʕ •́؈•̀) TypeScript template for Cloudflare Workers
TypeScriptで書く
型定義が提供されてるので、それをまずいれる。
npm i -D @cloudflare/workers-types
そしてそれを`tsconfig.json`で読む。
{ "compilerOptions": { "lib": ["esnext", "webworker"], "moduleResolution": "node", "esModuleInterop": true, "strict": true, "noUnusedLocals": true, "noUnusedParameters": true, "sourceMap": true, "target": "esnext", "types": ["@cloudflare/workers-types"] }, "include": [ "./**/*.ts", "./node_modules/@cloudflare/workers-types/index.d.ts" ], "exclude": ["node_modules/**/*"] }
ここまでは上述のテンプレと同じ。
esbuildでビルド
CFWはデフォルトで`webpack`によるビルドをサポートしているので、独自の`webpack.config.js`でTS対応するというのがテンプレのやり方。
ただ今回は`esbuild`でビルドさせたい、だって速いから。
で、そのためには、「自分でビルドします!」という設定を`wrangler.toml`に書く。
# ... [build] upload.format = "service-worker" command = "npm run build"
という感じ。
https://developers.cloudflare.com/workers/cli-wrangler/configuration#build
こうしておけば、`wrangler deploy`や`wrangler dev`のビルド時にこのコマンドが使われる。
CIでデプロイしてるなら、`npm i && npm run build`って書きたくなるかもしれない。
"main": "./worker.js", "scripts": { "build": "esbuild --bundle --minify ./src/main.ts > worker.js",
ファイルの場所はどこでもいいけど、`main`でちゃんと指し示すこと。