Supabase functionsでの「名前 'Deno' が見つかりません」エラーの解決方法

に公開

Supabase functions を開発している際に「名前 'Deno' が見つかりません。」というエラーが発生した場合の解決手順を解説します。

解決方法

Step 1. Mac に Deno をインストールする

brew install deno

Step 2. cursor の Deno 設定を有効化する

.vscode/settings.json の作成または編集

プロジェクトの .vscode/settings.json ファイルを開き、以下の設定を追加します。

{
  "deno.enable": true,
  "deno.lint": true,
  "deno.enablePaths": ["./supabase/functions"]
}

この設定により、Deno に依存したプロジェクトのコード補完や型チェックが有効になります。

設定オプションの詳細

  • deno.enable: Deno サポートを有効にします。
  • deno.lint: Deno の組み込み Linter を有効にします。

Supabase のローカル環境セットアップ

次に、Supabase functionsを動かすまでの手順を紹介します。

Supabaseのインストール

npm install supabase --save

次に、Supabaseのプロジェクトを初期化するため、以下のコマンドを実行します。

npx supabase init

これにより、プロジェクト直下に ./supabase/config.toml という設定ファイルが生成されます。このファイルはSupabaseの設定情報を管理します。


Supabase Functions の使用方法

Supabase Functionsを利用して、サーバーレス関数を構築・デプロイできます。

関数を作成する

npx supabase functions new <function-name>

これを実行すると、以下のようなディレクトリ構造で関数のテンプレートが作成されます。

./supabase/functions/<function-name>/index.ts

作成した関数をローカルで動かす

npx supabase functions serve

このコマンドを実行すると、サーバーレス関数がローカルで動作するようになります。


Functionsのコードで環境変数を利用する

ローカル環境

./supabase/functions/.envを配置する

DIFY_API_URL=<your-dify-api-url>
DIFY_API_KEY=<your-dify-api-key>

本番で利用する場合は、supabase secrets コマンドを使って環境変数を設定します。

環境変数の設定

npx supabase secrets set DIFY_API_URL="your-dify-api-url"
npx supabase secrets set DIFY_API_KEY="your-dify-api-key"

環境変数としてセットした値は、以下のように Deno.env.get() メソッドで取得できます。

const difyApiUrl = Deno.env.get('DIFY_API_URL')
const difyApikey = Deno.env.get("DIFY_API_KEY");

パスエイリアスを設定する

モジュール間の相対パスが複雑にならないように、Supabaseでは deno.json を使用してパスエイリアスを設定できます。

パスエイリアスの実例

例えば、以下の構成の場合:

./supabase/functions/generate/index.ts
./supabase/functions/_shared/config.ts

deno.json の設定

./supabase/functions/generate/deno.json に以下の内容を記述します。

{
  "imports": {
    "@shared/": "../_shared/"
  }
}

使用例

index.ts では以下のように、エイリアスを利用して config.ts をインポートできます。

import { config, validateConfig } from "@shared/config.ts";

これにより、Supabase Functions のローカル開発がスムーズに進行するはずです。Enjoy!!

Discussion