Home

Managing packages using Import Maps

Since Supabase CLI version 1.33.0 import maps can be used with Supabase Edge Functions.

Import maps is a web-platform standard that allows you to use bare specifiers with Deno without having to install the Node.js package locally.

So if we want to do the following in our code:

ignore

_10
import lodash from "lodash";

We can accomplish this using an import map, and we don't even have to install the lodash package locally. We would want to create a JSON file (for example import_map.json) with the following:


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

Import Map Placement#

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

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

Lastly, you can override this default behaviour by providing the --import-map <string> flag to the serve and deploy commands.

Visual Studio Code Configuration#

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.