In an ideal world, your code is always clean, consistent, and free of peskyerrors. That's the promise of Deno's built-in linting and formatting tools. Byintegrating these features directly into the runtime, Deno eliminates the needfor external dependencies and complex configurations in your projects. Theseinbuilt tools are fast and performant, not only saving time but also ensuringthat every line of code adheres to best practices.

Withdeno fmt anddeno lint, you can focus on writing great code, knowingthat Deno has your back. It's like having a vigilant assistant who keeps yourcodebase in top shape, allowing you to concentrate on what truly matters:building amazing applications.

LintingJump to heading#

Explore all the lint rules

Linting is the process of analyzing your code for potential errors, bugs, andstylistic issues. Deno's built-in linter,deno lint, supports recommended set of rulesfromESLint to provide comprehensive feedback on yourcode. This includes identifying syntax errors, enforcing coding conventions, andhighlighting potential issues that could lead to bugs.

To run the linter, use the following command in your terminal:

deno lint

By default,deno lint analyzes all TypeScript and JavaScript files in thecurrent directory and its subdirectories. If you want to lint specific files ordirectories, you can pass them as arguments to the command. For example:

deno lint src/

This command will lint all files in thesrc/ directory.

The linter can be configured in adeno.json file. You canspecify custom rules, plugins, and settings to tailor the linting process toyour needs.

Linting rulesJump to heading#

You can view and search the list of available rules and their usage on theList of rules documentation page.

FormattingJump to heading#

Formatting is the process of automatically adjusting the layout of your code toadhere to a consistent style. Deno's built-in formatter,deno fmt, uses thepowerfuldprint engine to ensure that your code is alwaysclean, readable, and consistent.

To format your code, simply execute the following command in your terminal:

denofmt

By default,deno fmt formats all TypeScript and JavaScript files in thecurrent directory and its subdirectories. If you want to format specific filesor directories, you can pass them as arguments to the command. For example:

denofmt src/

This command will format all files in thesrc/ directory.

Checking your formattingJump to heading#

Thedeno fmt --check command is used to verify if your code is properlyformatted according to Deno's default formatting rules. Instead of modifying thefiles, it checks them and reports any formatting issues. This is particularlyuseful for integrating into continuous integration (CI) pipelines or pre-commithooks to ensure code consistency across your project.

If there are formatting issues,deno fmt --check will list the files that needformatting. If all files are correctly formatted, it will simply exit withoutany output.

Integration in CIJump to heading#

You can adddeno fmt --check to your CI pipeline to automatically check forformatting issues. For example, in a GitHub Actions workflow:

jobs:  build:    runs-on: ubuntu-latest    steps:      - uses: actions/checkout@v4      - uses: denoland/setup-deno@v2        with:          deno-version: v2.x      - run: deno fmt --check

This ensures that any code changes adhere to the project's formatting standardsbefore being merged.

Integration in VS CodeJump to heading#

To enable Deno as your formatter in VS Code, you have to set it up as yourdefault formatter in the settings, and then add a.vscode/settings.json filein the root of your project with the following configuration:

{"deno.enablePaths":["./deno.json"]}

If yourdeno.json(c) file is located in a subdirectory of your project,provide the correct relative path to it instead.

Available optionsJump to heading#

bracePositionJump to heading#

Define brace position for blocks

• Default:sameLine
• Possible values:maintain,sameLine,nextLine,sameLineUnlessHanging

jsx.bracketPositionJump to heading#

Define bracket position for JSX

• Default:nextLine
• Possible values:maintain,sameLine,nextLine

jsx.forceNewLinesSurroundingContentJump to heading#

Forces newlines surrounding the content of JSX elements

• Default:false
• Possible values:true,false

jsx.multiLineParensJump to heading#

Surrounds the top-most JSX element or fragment in parentheses when it spansmultiple lines

• Default:prefer
• Possible values:never,prefer,always

indentWidthJump to heading#

Define indentation width

• Default:2
• Possible values:number

lineWidthJump to heading#

Define maximum line width

• Default:80
• Possible values:number

newLineKindJump to heading#

The newline character to use

• Default:lf
• Possible values:auto,crlf,lf,system

nextControlFlowPositionJump to heading#

Define position of next control flow

• Default:sameLine
• Possible values:sameLine,nextLine,maintain

semiColonsJump to heading#

Whether to prefer using semicolons.

• Default:true
• Possible values:true,false

operatorPositionJump to heading#

Where to place the operator for expressions that span multiple lines

• Default:sameLine
• Possible values:sameLine,nextLine,maintain

proseWrapJump to heading#

Define how prose should be wrapped

• Default:always
• Possible values:always,never,preserve

quotePropsJump to heading#

Control quoting of object properties

• Default:asNeeded
• Possible values:asNeeded,consistent,preserve

singleBodyPositionJump to heading#

The position of the body in single body blocks

• Default:sameLineUnlessHanging
• Possible values:sameLine,nextLine,maintain,sameLineUnlessHanging

singleQuoteJump to heading#

Use single quotes

• Default:false
• Possible values:true,false

spaceAroundJump to heading#

Control spacing around enclosed expressions

• Default:false
• Possible values:true,false

spaceSurroundingPropertiesJump to heading#

Control spacing surrounding single line object-like nodes

• Default:true
• Possible values:true,false

trailingCommasJump to heading#

Control trailing commas in multi-line arrays/objects

• Default:always
• Possible values:always,never

typeLiteral.separatorKindJump to heading#

Define separator kind for type literals

• Default:semiColon
• Possible values:comma,semiColon

unstable-componentJump to heading#

Enable formatting Svelte, Vue, Astro and Angular files

unstable-sqlJump to heading#

Enable formatting SQL files

useTabsJump to heading#

Use tabs instead of spaces for indentation

• Default:false
• Possible values:true,false

useBracesJump to heading#

Whether to use braces for if statements, for statements, and while statements

• Default:whenNotSingleLine
• Possible values:maintain,whenNotSingleLine,always, preferNone

ConfigurationJump to heading#

The formatter can be configured in adeno.json file. You canspecify custom settings to tailor the formatting process to your needs.

Deno support for other linters and formattersJump to heading#

ESLintJump to heading#

To use the VSCode ESLint extension in your Deno projects, your project will needanode_modules directory in your project that VSCode extensions can pick up.

In yourdeno.json ensure anode_modules folder is created, so the editor canresolve packages:

{"nodeModulesDir":"auto"}

(Optional) Run an ESLint command to download it:

deno run-A npm:eslint--version# ordeno run-A npm:eslint--init

Create aneslint.config.js:

// eslint.config.jsimport jsfrom"@eslint/js";import importPluginfrom"eslint-plugin-import";// example pluginexportdefault[  js.configs.recommended,{files:["**/*.ts","**/*.js"],languageOptions:{globals:{Deno:"readonly"}},plugins:{import: importPlugin},rules:{// e.g. "import/order": "warn"},},];

To run ESLint run:

deno run-A npm:eslint.

Optionally, you can add a task in yourdeno.json to run ESLint:

{"tasks":{"eslint":"eslint . --ext .ts,.js"}}

And run it with:

deno task eslint

PrettierJump to heading#

To use Prettier in your Deno projects, your project will need anode_modulesdirectory in your project that VSCode extensions can pick up.

Then install the Prettier extension for VSCode and configure it to be yourdefault formatter:

In VSCode:

1. Open the Command Palette (withCmd+Shift+P)
2. SelectFormat Document With...
3. SelectConfigure Default Formatter...
4. SelectPrettier - Code formatter