Skip to content

JavaScript and TypeScript

Run ESLint before Prettier, and enable TypeScript checking when you need it.

Prerequisites: ESLint, Prettier, and TypeScript executables on PATH, plus their project configuration. If they are package dependencies, expose node_modules/.bin through mise or your existing environment.

Download javascript-project.pkl and save it as hk.pkl.

Configuration

pkl
/// Prettier and ESLint, with TypeScript checking enabled by the types profile.
amends "package://github.com/jdx/hk/releases/download/v2.0.1/hk@2.0.1#/Config.pkl"

import "package://github.com/jdx/hk/releases/download/v2.0.1/hk@2.0.1#/Builtins.pkl"

steps {
  ["eslint"] = Builtins.eslint
  ["prettier"] = (Builtins.prettier) {
    // Choose a stable order when both tools can format JavaScript.
    depends = "eslint"
  }
  ["tsc"] = (Builtins.tsc) {
    profiles = List("types")
  }
}

Try it

sh
hk validate
hk check --all --plan
hk check --all
hk check --all --profile types
hk fix

ESLint and Prettier can both change JavaScript files. The dependency gives them a stable order; configure their rules to agree. TypeScript checking stays behind the types profile so it is opt-in.

Top-level steps supplies the default pre-commit, check, and fix hooks. The pre-commit hook saves unstaged work before fixing and staging changes.

Adapt it

Remove tsc for a JavaScript-only project. If your tools live in multiple packages, use workspaces or the monorepo example. Use hk check --all --profile types in CI to include type checking.

MIT LicenseCopyright © 2026jdx.dev