Files

174 lines
5.4 KiB
Plaintext

---
id: 'functions-import-maps'
title: 'Managing dependencies'
description: 'Managing packages and dependencies.'
subtitle: 'Managing packages and dependencies.'
tocVideo: 'ILr3cneZuFk'
---
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.
## Managing dependencies
There are two ways to manage your dependencies in Supabase Edge Functions:
### Using deno.json (Recommended)
<Admonition type="info">
This feature requires Supabase CLI version 1.215.0 or higher.
</Admonition>
Each function can have its own `deno.json` or `deno.jsonc` file to manage dependencies and configure Deno-specific settings. For a complete list of supported options, see the [official Deno configuration documentation](https://docs.deno.com/runtime/manual/getting_started/configuration_file).
```json supabase/functions/my-function/deno.json
{
"imports": {
"lodash": "https://cdn.skypack.dev/lodash"
}
}
```
This allows you to use simplified imports:
```ts
import lodash from 'lodash'
```
The recommended file structure when using `deno.json`:
```bash
└── supabase
├── functions
│ ├── function-one
│ │ ├── index.ts
│ │ └── deno.json # Function-specific Deno configuration
│ └── function-two
│ ├── index.ts
│ └── deno.json # Function-specific Deno configuration
└── config.toml
```
### Using Import Maps (Legacy)
Import Maps are a legacy way to manage dependencies, similar to a `package.json` file. While still supported, we recommend using `deno.json`. If both exist, `deno.json` takes precedence.
```json supabase/functions/import_map.json
{
"imports": {
"lodash": "https://cdn.skypack.dev/lodash"
}
}
```
The import map should be placed in the `/supabase/functions` folder and will be applied to all functions:
```bash
└── supabase
├── functions
│ ├── import_map.json # Top-level import map for all functions
│ ├── function-one
│ │ └── index.ts
│ └── function-two
│ └── index.ts
└── config.toml
```
You can override the import map location using the `--import-map <string>` flag with `serve` and `deploy` commands.
If using import maps with VSCode, update your `.vscode/settings.json`:
```json settings.json
{
"deno.enable": true,
"deno.unstable": [
"bare-node-builtins",
"byonm"
// ... other flags ...
],
"deno.importMap": "./supabase/functions/import_map.json"
}
```
You can override the default import map location in two ways:
1. Using the `--import-map <string>` flag with `serve` and `deploy` commands
2. Setting the `import_map` property in your `config.toml` file for specific functions:
```toml supabase/config.toml
[functions.my-function]
import_map = "./supabase/functions/my-function/custom_import_map.json"
```
For more configuration options, see the [CLI Configuration documentation](/docs/guides/local-development/cli/config#functions.function_name.import_map).
## Importing dependencies
Supabase Edge Functions support several ways to import dependencies:
- The Deno [standard library](https://deno.land/std)
- JavaScript modules from npm (https://docs.deno.com/examples/npm/)
- Built-in [Node APIs](https://docs.deno.com/runtime/manual/node/compatibility)
- Third party modules published to [JSR](https://jsr.io/) or [deno.land/x](https://deno.land/x)
### NPM Modules
You can import npm modules using the `npm:` specifier:
```ts
import { createClient } from 'npm:@supabase/supabase-js@2'
```
### Node.js Built-ins
For Node.js built-in APIs, use the `node:` specifier:
```ts
import process from 'node:process'
```
Learn more about npm specifiers and Node built-in APIs in [Deno's documentation](https://docs.deno.com/runtime/manual/node/npm_specifiers).
### Importing from Private Registries
<Admonition type="info">
This feature requires Supabase CLI version 1.207.9 or higher.
</Admonition>
Create a `.npmrc` file within `supabase/functions`. This will allow you to import the private packages into multiple functions. Alternatively, you can place the `.npmrc` file directly inside `supabase/functions/function-name` directory.)
Add your registry details in the `.npmrc` file. Follow [this guide](https://docs.npmjs.com/cli/v10/configuring-npm/npmrc) to learn more about the syntax of npmrc files.
```
@myorg:registry=https://npm.registryhost.com
//npm.registryhost.com/:_authToken=VALID_AUTH_TOKEN
```
After that, you can import the package directly in your function code or add it to the import_map.json (/docs/guides/functions/import-maps#using-import-maps).
```ts
import MyPackage from 'npm:@myorg/private-package@v1.0.1'
// use MyPackage
```
## Importing types
If your [environment is set up properly](/docs/guides/functions/local-development) 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:
```ts
// @deno-types="npm:@types/express@^4.17"
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:
```ts
/// <reference types="npm:@types/node" />
```