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:

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:

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

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:

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

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