How to use import-map with Deno

Question

I have this import_map.json file:

{
  "imports": {
    "node_modules/" : "./node_modules"
  }
}

at a high-level I am trying to create some compatibility for .ts files, for both Deno and Node.

My imports look like this:

import * as util from 'util';
import chalk from "node_modules/chalk";

When I run this:

deno run --import-map='import_map.json' ./src/linked-queue.ts

I get this loathsome error:

Import map diagnostics:
  - Invalid target address "file:///.../linked-queue/node_modules" for package specifier "node_modules/". Package address targets must end with "/".
error: Blocked by null entry for ""node_modules/""
    at file:///.../linked-queue/src/linked-queue.ts:4:19

Anyone know how to resolve this error?

for info on import-map, I used this link - https://deno.land/manual@v1.29.1/basics/modules/import_maps — Alexander Mills, Dec 24 '22 at 02:51

Zac Anger · Answer 1 · 2022-12-24T03:03:12.687

1

  "imports": {
    "node_modules/" : "./node_modules/"
  }

Add a trailing slash on the target specifier. See also the spec and the source.

edited Dec 24 '22 at 03:03

answered Dec 24 '22 at 02:57

Zac Anger

6,983
2
15
42

yeah I get a new error: `error: Relative import path "node_modules/chalk" not prefixed with / or ./ or ../ at file:///.../linked-queue/src/linked-queue.ts:4:19 ` – Alexander Mills Dec 24 '22 at 02:59
1

I'm seeing a couple of issues. For one, chalk doesn't work because deno doesn't support Node-style module resolution entirely correctly [see the roadmap](https://github.com/denoland/deno/issues/15960) — it gives an `Is a directory` error because Deno's not respecting `main` in chalk's package. You can test this by adding an arbitrary TypeScript file in node_modules and importing that, it'll work just fine. Second, chalk itself isn't working with Deno, because it has its own import maps which are conflicting with the one specified on the CLI. – Zac Anger Dec 24 '22 at 03:24
2

The TLDR there is, Deno doesn't seem to really be ready for node_modules interop. XKCD 927. – Zac Anger Dec 24 '22 at 03:29
yeah I guess not, that's fine, understandable – Alexander Mills Dec 24 '22 at 03:41

jsejcksn · Answer 2 · 2022-12-24T05:46:46.907

The manual covers this scenario in the following three sections:

I'll show a reproducible example rather than copy + paste everything from the docs (because a few copied snippets aren't really enough; this is a multi-faceted issue) — however take note of the values in the import map, as they are derived by reading through all three linked sections of the documentation:

./import_map.json:

{
  "imports": {
    "chalk": "npm:chalk@5.2.0",
    "node:util": "https://deno.land/std@0.170.0/node/util.ts"
  }
}

./deno.jsonc:

{
  "importMap": "./import_map.json",
  "tasks": {
    // I included these permissions (which are required by chalk) in advance to avoid needing to grant them one-by-one at runtime:
    "dev": "deno run --allow-env=FORCE_COLOR,TF_BUILD,TERM,CI,TEAMCITY_VERSION,COLORTERM,TERM_PROGRAM,TERM_PROGRAM_VERSION src/linked-queue.ts"
  }
}

./src/linked-queue.ts:

import * as util from "node:util";
import chalk from "chalk";

console.log('util:', typeof util); // util: object
console.log('chalk:', typeof chalk); // chalk: function

Running in the terminal using the defined task:

% deno --version
deno 1.29.1 (release, x86_64-apple-darwin)
v8 10.9.194.5
typescript 4.9.4

% deno task dev
Task dev deno run --allow-env=FORCE_COLOR,TF_BUILD,TERM,CI,TEAMCITY_VERSION,COLORTERM,TERM_PROGRAM,TERM_PROGRAM_VERSION src/linked-queue.ts
util: object
chalk: function

% echo $?
0

So far, everything is great in Deno.

Let's check to see that the same code works without modification in Node.js. The following files need to be added to compile and run using Node, since it doesn't include all of Deno's built-in tooling:

./package.json:

{
  "name": "so-74905332",
  "version": "0.1.0",
  "type": "module",
  "scripts": {
    "compile": "tsc",
    "dev": "tsc && node src/linked-queue.js"
  },
  "license": "MIT",
  "dependencies": {
    "chalk": "5.2.0"
  },
  "devDependencies": {
    "@types/node": "^18.11.17",
    "typescript": "^4.9.4"
  }
}

./tsconfig.json:

Why these values? I'm just using a recommended base, linked to from the TS repo wiki:

// This file was autogenerated by a script
// Equivalent to a config of: strictest extends esm extends node18
{
  "$schema": "https://json.schemastore.org/tsconfig",
  "display": "Node LTS + ESM + Strictest",
  "_version": "18.12.1",
  "compilerOptions": {
    "lib": [
      "es2022"
    ],
    "module": "es2022",
    "target": "es2022",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "moduleResolution": "node",
    "allowUnusedLabels": false,
    "allowUnreachableCode": false,
    "exactOptionalPropertyTypes": true,
    "noFallthroughCasesInSwitch": true,
    "noImplicitOverride": true,
    "noImplicitReturns": true,
    "noPropertyAccessFromIndexSignature": true,
    "noUncheckedIndexedAccess": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "importsNotUsedAsValues": "error",
    "checkJs": true
  }
}

Running in the terminal using the defined npm script:

% node --version
v18.12.1

% npm install

added 3 packages, and audited 4 packages in 1s

1 package is looking for funding
  run `npm fund` for details

found 0 vulnerabilities

% npm run dev

> so-74905332@0.1.0 dev
> tsc && node src/linked-queue.js

util: object
chalk: function

% echo $?
0

The same module source code also works in Node.js.

How to use import-map with Deno

2 Answers2

Linked

Related