Edge Functions

Managing dependencies

Managing packages and dependencies.

Developing with Edge Functions is similar to developing with Node.js, but with a few key differences. This guide will help you understand how to manage your dependencies.

Importing dependencies

Supabase Edge Functions support:

You can import npm modules using the npm: specifier or via CDNs like esm.sh. For example, to import the supabase-js package:


_10
import { createClient } from 'npm:@supabase/supabase-js@2'

If you are migrating an existing Node app and if it uses a built-in Node APIs, you can import them to Deno using node: specifiers. For example, if your code uses process.env, you can import it as follows:


_10
import process from 'node:process'

You can learn more about npm: specifiers and Node built-in APIs, in Deno's documentation.

Importing types

If your environment is set up properly and the module you're importing is exporting types, the import will have types and autocompletion support.

Some npm packages may not ship out of the box types and you may need to import them from a separate package. You can specify their types with a @deno-types directive:


_10
// @deno-types="npm:@types/express@^4.17"
_10
import express from 'npm:express@^4.17'

To include types for built-in Node APIs, add the following line to the top of your imports:


_10
/// <reference types="npm:@types/node" />

Using import maps

An Import Map is similar to a package.json file. They are a way to manage your dependencies. Consider this code:


_10
// without import maps:
_10
import lodash from 'https://cdn.skypack.dev/lodash'
_10
_10
// with import maps:
_10
import lodash from 'lodash'

You can accomplish this using an Import Map, which is a JSON file with the following:

supabase/functions/import_map.json

_10
{
_10
"imports": {
_10
"lodash": "https://cdn.skypack.dev/lodash"
_10
}
_10
}

We recommend creating one import_map.json within the /supabase/functions folder, similar to a package.json file, to define imports that can be used across all of your project's functions.


_10
└── supabase
_10
├── functions
_10
│ ├── import_map.json # A top-level import map to use across functions..
_10
│ ├── function-one
_10
│ │ └── index.ts
_10
└── config.toml

Alternatively, you can create one import_map.json file in each function folder, which will take priority over a top-level file.

You can override this default behavior by providing the --import-map <string> flag to the serve and deploy commands.

Configuring VSCode

In order for vscode to understand the imports correctly, you need to specify the deno.importMap flag in your .vscode/settings.json file:

settings.json

_10
{
_10
"deno.enable": true,
_10
"deno.unstable": true,
_10
"deno.importMap": "./supabase/functions/import_map.json"
_10
}

For a full guide on developing with Deno in Visual Studio Code, see this guide.