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:
- The Deno standard library
- JavaScript modules from npm (https://docs.deno.com/examples/npm/)
- Built-in Node APIs
- Third party modules published to JSR or deno.land/x
You can import npm modules using the npm:
specifier or via CDNs like esm.sh. For example, to import the supabase-js
package:
_10import { 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:
_10import 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"_10import 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:_10import lodash from 'https://cdn.skypack.dev/lodash'_10_10// with import maps:_10import lodash from 'lodash'
You can accomplish this using an Import Map, which is a JSON file with the following:
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:
For a full guide on developing with Deno in Visual Studio Code, see this guide.