Using npm packages in Deno - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ component_behavior

intermediate

What is the output of this Deno code importing an npm package?

Consider this Deno script that imports the lodash npm package and uses its capitalize function:

import { capitalize } from "npm:lodash";

console.log(capitalize("deno"));

What will this code print when run with deno run --allow-net?

Deno

import { capitalize } from "npm:lodash";

console.log(capitalize("deno"));

A "Deno"

B "deno"

C TypeError: capitalize is not a function

D SyntaxError: Unexpected token import

💡 Hint

Think about what the capitalize function does to a string.

The capitalize function from lodash converts the first letter of the string to uppercase and the rest to lowercase. So "deno" becomes "Deno".

📝 Syntax

intermediate

Which import statement correctly loads an npm package in Deno?

Which of the following import statements correctly imports the axios npm package in a Deno script?

A import axios from "./node_modules/axios/index.js";

B import axios from "https://cdn.skypack.dev/axios";

C const axios = require("axios");

D import axios from "npm:axios";

💡 Hint

Deno supports direct npm imports with a special prefix.

Deno allows importing npm packages directly using the npm: prefix. Option D uses this correct syntax. Option D uses a CDN URL which is valid but not the direct npm import feature. Option D uses CommonJS require which Deno does not support natively. Option D tries to import from a local node_modules folder which is not standard in Deno.

🔧 Debug

advanced

Why does this Deno script fail to run?

Given this Deno script:

import { v4 } from "npm:uuid";

console.log(v4());

Running deno run script.ts results in an error: Uncaught ReferenceError: crypto is not defined. What is the most likely cause?

Deno

import { v4 } from "npm:uuid";

console.log(v4());

A The script lacks the <code>--unstable</code> flag needed for crypto API in Deno.

B The <code>uuid</code> package is not compatible with Deno's npm support.

C Deno requires <code>--allow-net</code> permission to run this script.

D The <code>v4</code> function is not exported by the uuid package.

💡 Hint

Deno's crypto API is behind a flag in some versions.

The uuid package uses the crypto API to generate random values. In Deno, the crypto API is sometimes behind the --unstable flag. Without it, the script throws a ReferenceError.

❓ state_output

advanced

What is the value of variable result after running this Deno code?

Consider this Deno script using the dayjs npm package:

import dayjs from "npm:dayjs";

const result = dayjs("2024-01-01").add(1, "month").format("YYYY-MM-DD");
console.log(result);

What will be printed?

Deno

import dayjs from "npm:dayjs";

const result = dayjs("2024-01-01").add(1, "month").format("YYYY-MM-DD");
console.log(result);

A "2024-01-31"

B "2024-02-29"

C "2024-02-01"

D "2024-03-01"

💡 Hint

Adding one month to January 1st should move to February 1st.

The dayjs library adds one calendar month to January 1, 2024, resulting in February 1, 2024. The format outputs it as "2024-02-01".

🧠 Conceptual

expert

Which statement about using npm packages in Deno is TRUE?

Choose the correct statement about how Deno handles npm packages:

A Deno automatically converts all CommonJS npm packages to ES modules without any configuration.

B Deno requires explicit permission flags to access network or file system when using npm packages that perform such operations.

C Deno caches npm packages only in memory and downloads them every time the script runs.

D Deno does not support importing npm packages that have native C++ bindings.

💡 Hint

Think about Deno's security model and how it applies to npm packages.

Deno enforces security permissions for scripts, including those importing npm packages. If an npm package needs network or file system access, the user must grant explicit permissions via flags like --allow-net or --allow-read. Option B is false because some CommonJS packages need manual conversion or shims. Option B is false because Deno caches packages on disk. Option B is false as Deno can support native bindings with proper setup.

Practice

1. What is the correct way to import an npm package named lodash in a Deno script?

easy

A. import _ from "npm:lodash";

B. import _ from "https://cdn.lodash.com/lodash.js";

C. import _ from "deno:lodash";

D. import _ from "node_modules/lodash";

Solution

1. Step 1: Understand Deno npm import syntax

   Deno uses the syntax import package from "npm:package-name" to import npm packages directly.

2. Step 2: Match the syntax to the lodash package

   Using import _ from "npm:lodash"; correctly imports lodash from npm in Deno.

3. Final Answer:

   import _ from "npm:lodash"; -> Option A

4. Quick Check:

   npm import syntax = import from "npm:package" [OK]

Hint: Use import from "npm:package-name" to add npm packages [OK]

Common Mistakes:

• Using URL imports instead of npm: prefix
• Trying to import from local node_modules folder
• Using incorrect prefix like deno: or https:

2. Which of the following is the correct syntax to import the axios package from npm in Deno?

easy

A. import axios from "npm:axios";

B. import axios from "npm axios";

C. import axios from "npm:/axios";

D. import axios from "npm::axios";

Solution

1. Step 1: Check correct npm import syntax

   The correct syntax uses a colon after npm, no spaces or extra characters: npm:package-name.

2. Step 2: Identify the valid option

   Only import axios from "npm:axios"; matches the correct syntax.

3. Final Answer:

   import axios from "npm:axios"; -> Option A

4. Quick Check:

   Correct npm import = "npm:package" [OK]

Hint: Remember no spaces or extra symbols in npm import path [OK]

Common Mistakes:

• Adding spaces between npm and package name
• Using slashes or double colons incorrectly
• Omitting the npm: prefix

3. Given this Deno code snippet, what will be the output?

import chalk from "npm:chalk";
console.log(chalk.green("Success!"));

medium

A. Runtime error: chalk is undefined.

B. A syntax error because chalk cannot be imported this way.

C. The text 'chalk.green("Success!")' printed literally.

D. The text 'Success!' printed in green color in the console.

Solution

1. Step 1: Understand chalk npm package usage

   Chalk colors console text. Importing via npm in Deno works if syntax is correct.

2. Step 2: Analyze the console.log statement

   Calling chalk.green("Success!") returns the string 'Success!' styled green in supported terminals.

3. Final Answer:

   The text 'Success!' printed in green color in the console. -> Option D

4. Quick Check:

   npm chalk import + chalk.green() = green text output [OK]

Hint: chalk colors text; npm import works if syntax is right [OK]

Common Mistakes:

• Assuming import fails without checking syntax
• Expecting literal string output instead of colored text
• Confusing runtime errors with import errors

4. What is wrong with this Deno code snippet?

import express from "npm:express";
const app = express();
app.listen(3000);
console.log("Server running on port 3000");

medium

A. The import statement syntax is incorrect.

B. Deno does not support importing express from npm.

C. Missing permission flag to allow network access.

D. express() is not a function in this context.

Solution

1. Step 1: Check import syntax and package support

   Importing express from npm is valid syntax in Deno 1.28+ and later.

2. Step 2: Identify runtime requirements

   Running a server requires network permissions. Without --allow-net, Deno blocks network calls causing failure.

3. Final Answer:

   Missing permission flag to allow network access. -> Option C

4. Quick Check:

   Network access needs --allow-net flag in Deno [OK]

Hint: Remember to add --allow-net for server network access [OK]

Common Mistakes:

• Assuming all npm packages work without permissions
• Confusing import syntax errors with permission errors
• Not running Deno with required flags

5. You want to use the npm package uuid in Deno to generate a version 4 UUID. Which code snippet correctly imports and uses it?

hard

A. import v4 from "npm:uuid";
console.log(v4());

B. import { v4 as uuidv4 } from "npm:uuid";
console.log(uuidv4());

C. import uuid from "npm:uuid";
console.log(uuid.v4());

D. import * as uuid from "npm:uuid";
console.log(uuid.v4);

Solution

1. Step 1: Understand uuid package export style

   The uuid package exports v4 as a named export, so it must be imported with curly braces or aliased.

2. Step 2: Check each import usage

   A: Default import fails--no default export in uuid.
   B: Correct named import with alias and proper call.
   C: Default import lacks v4 property.
   D: Namespace import ok, but missing () logs function, not UUID.

3. Final Answer:

   import { v4 as uuidv4 } from "npm:uuid"; console.log(uuidv4()); -> Option B

4. Quick Check:

   Named import with alias for v4 UUID = import { v4 as uuidv4 } from "npm:uuid"; console.log(uuidv4()); [OK]

Hint: Use named import with alias for uuid v4 function [OK]

Common Mistakes:

• Importing default when package exports named functions
• Calling v4 without importing it properly
• Omitting parentheses when calling uuid.v4