📘 Deno JSR Packages

example-jsr-packages.ts

import { toKebabCase } from "jsr:@std/text@^1.0.9";

const originalString = "My example string with a space.";

const newString = toKebabCase(originalString);

console.log(newString);

gist-jsr-packages.md

Importing JSR Packages in Fresh Projects

This is a guide on how to use @std/text and other JSR packages in a @fresh project. JSR (JavaScript Registry) is @deno official package registry, offering a wide range of type-safe packages that can be easily integrated into any projects.

Table of Contents

• Installation
• Adding JSR Packages
• Importing JSR Packages
• External Resources

Installation

Starting a @fresh project begins with the following command.

deno run -A -r https://fresh.deno.dev

📖 Note: Define the project directory with the . argument to set the current directory as the project directory.

Adding JSR Packages

While using an import map is possible, as specificied in the @config/schema most documentation outlines imports as part of the deno.json file. Below is an exmaple of how to add a JSR package to your deno.json file.

{
	"imports": {
		"@std/text": "jsr:@std/text@1.0.9"
	}
}

📖 Note: The key may be any value, but it is recommended to use the package name like @std/text.

The jsr: specifier is used to direct @deno to the @jsr registry to resolve the package. The complete package name follows the jsr: specifier. The complete package name is the title of the package as it appears on the @jsr website.

📖 Note: The @ symbol is the first character of every name of every package on the @jsr website, followed by the name of the scope, a /, and then the specific package.

You may specify a major version, minor version, or patch version with @ followed by the major version, minor version, and/or patch version number. For example, jsr:@std/text@1.0.9 will import the 1.0.9 version of the @std/text package. While, jsr:@std/text@1 will import the latest release for that major version of the @std/text package.

Importing JSR Packages

After you have added the package to your deno.json file, you can use the package in your project. Below is an example of how to import the @std/text package into your project after you have added it to your deno.json file.

import { toKebabCase } from "@std/text";

const originalString = "My example string with a space.";

const newString = toKebabCase(originalString);

console.log(newString); /* "my-example-string-with-a-space" */

📖 Note: It is possible to import packages without adding them to the deno.json file. To do so, you must use the jsr: specifier. For example, jsr:@std/text@1.0.9 will import the 1.0.9 version of the @std/text package.

External Resources

Feel free to check out the specifications of @semver to learn more about semantic versioning. In addition, search for other packages you may want to use in your project with the @jsr website (which also has documentation for your guidance at @jsr/docs). Lastly, check out the @config/schema if you are interested in details about the deno.json file.

Author

This gist is also available in a public respository created by the author ktortolini. Please, feel free to contact the author via email ✉ ktortolini@smu.edu.