In the previous post I talked about using JSX in Deno.
Now I would like to use import maps to make the imports easier to manage.
Lets start with this example:
I also added a tsconfig as an example, but you don’t really need this here because this is the default.
This program can be started like this: deno run --allow-net --config=tsconfig.json main.js
To avoid typing long commands each time, I started using Denon.
You can find installation instructions here.
This will get you an initial config:
Here is my config:
You can remove the importmap line for now.
Now you can use denon start to start.
This will also watch your files and do a restart when needed.
Let’s create an import map file named importmap.json:
The line "/": "./", means that we can use absolute paths instead of relative paths.
You can find more information here
The imports can now be rewritten like this in main.js:
If you use vscode and are getting errors, you may need to add some settings.
First make sure you have the Deno plugin and that you initialised the workspace.
You can initialise the workspace with the command Deno: Initialise Workspace Configuration in the Command Palette.
This will create a file .vscode/settings.json.
You can add the importMap and config to fix the errors.