Guide · Agent skill

How to use the Find npm Packages agent skill for checklist rules

Updated 2026-10-29 · written with AI from the project's own documentation and checked against our catalogue data

The find-npm-packages skill is an agent skill for maintainers of the Front-End Checklist repository. Given a frontend checklist rule, it guides an agent to find the 2-3 most popular and well-maintained npm packages that relate to that rule, check them against download and recency thresholds, and write their names into the rule's frontmatter. This guide explains what the skill does, how to install it, how to trigger it, and what to check before you trust its output.

Find npm Packages for Checklist Rulesthedaviddias/Front-End-Checklist · MIT Download the skill

Quick start

1Download the ZIP. Get the find-npm-packages skill as a ZIP from the Front-End Checklist skills page.
2Install the skill. Unzip it into ~/.claude/skills/ or a project's .claude/skills/ folder, or upload it under Settings → Capabilities → Skills in the Claude apps.
3Check prerequisites. Confirm Node.js, pnpm, curl and jq are available and that you have network access to registry.npmjs.org and api.npmjs.org.
4Ask for a specific rule. Request packages for one rule by file or slug, and state that you want them added to the frontmatter.
5Review candidate checks. Check that each proposed package has more than 10,000 weekly downloads and was published within 18 months.
6Update the frontmatter. Confirm the npmPackages array holds two or three package names only, placed after tools: and before resources:.
7Run validation. Run pnpm validate:packages against the rule file and fix or replace any package that fails.

What is an agent skill and what does this one do?

An agent skill is a folder containing a SKILL.md file with instructions that an AI agent can load when a task matches the skill's description. This skill is named find-npm-packages and its description says it applies when you need the 2-3 most popular and well-maintained npm packages for a frontend checklist rule.

When it runs, the skill asks the agent to read the rule file, work out what the rule checks, and look for npm packages that detect, fix, or test that issue. Each candidate is checked against two thresholds: more than 10,000 weekly downloads and a last publish date within 18 months. The agent then selects up to three packages and adds an npmPackages array to the rule's frontmatter, placed after tools: and before resources:.

Reads the rule file at packages/content/rules/en/{category}/{slug}.mdx
Looks for detectors, fixers and test tools for the rule
Checks each candidate's registry metadata and weekly downloads
Keeps 2-3 packages that pass, and writes package names only

How do you install the find-npm-packages skill?

Download the skill as a ZIP from the Front-End Checklist skills page. Then install it using one of two routes.

For Claude Code, unzip the file into ~/.claude/skills/ to make it available everywhere, or into a project's .claude/skills/ folder to limit it to one repository. For the Claude apps, upload the ZIP under Settings → Capabilities → Skills.

Personal install: unzip into ~/.claude/skills/
Project install: unzip into the repository's .claude/skills/
Claude apps: Settings → Capabilities → Skills, then upload the ZIP

What do you need before running it?

The skill assumes you are working inside the Front-End Checklist repository. Its validation step runs through the repository's pnpm validate:packages script, so you need Node.js and pnpm available. The research steps use curl and jq to query the npm registry and downloads API, so those tools must be installed too.

The agent also needs network access to registry.npmjs.org and api.npmjs.org. Without that access, the threshold checks cannot be completed.

Node.js and pnpm, with the repository's validate:packages script
curl and jq
Network access to registry.npmjs.org and api.npmjs.org

How do you trigger the skill with a natural request?

Name the rule you are working on, either as a file or as a slug, and say you want npm packages found and added. The skill description focuses on finding packages for a frontend checklist rule, so requests that mention those terms are the most likely to match.

The skill is meant for a specific rule. Asking for packages for a whole category or for general project work will not match its purpose.

"Find npm packages for the form-labels rule and add them to its frontmatter."
"Use the find-npm-packages skill on accessibility/form-labels."
"Suggest 2-3 well-maintained npm packages for this checklist rule and add them to npmPackages."

What does a worked example look like?

The source gives the rule accessibility/form-labels as an example. For that rule, the skill's example output adds three packages to the frontmatter. The example states that all three had more than 100,000 weekly downloads and were published within the last six months.

Treat this as an illustration of the output format, not a recommendation to copy. Run the thresholds again for any rule you work on.

npmPackages:
  - eslint-plugin-jsx-a11y
  - axe-core
  - @testing-library/jest-dom

What safety checks should you apply?

This skill runs scripts and uses the network. It queries the npm registry and downloads API, and it runs the repository's validation script. Review the commands the agent proposes before you approve them, and make sure you are in the correct repository.

The skill checks only download counts and publish dates. It does not check security advisories or licensing. If package choice must be authoritative or security-audited, do that review separately before you publish the rule.

Review the curl, jq and pnpm commands before running them
Confirm you are in the Front-End Checklist repository
Do not treat the thresholds as a security or licence review

What tips help you get good results?

Give the skill a specific rule. The skill prefers packages from the official toolchain, such as eslint or stylelint with their official plugins, and it prefers a mix of one detector, one fixer and one framework helper where that fits. If fewer than two packages pass, it accepts one or leaves the field empty.

After the agent edits the file, run pnpm validate:packages against the rule path. If any package fails, remove it or replace it with a better one.

Name one rule per request
Expect a mix of detector, fixer and framework helper where relevant
Accept fewer than 2 packages rather than forcing weak ones
Re-run the validation script after every change

pnpm validate:packages packages/content/rules/en/{category}/{slug}.mdx

What people use it for

Adding tool references to an accessibility rule so the project website can show relevant libraries
Finding a detector, a fixer and a test helper for a performance rule
Keeping npmPackages consistent across several rules in the same category
Replacing a package in an existing rule that no longer passes the recency threshold

Frequently asked questions

How do I install the find-npm-packages skill?

Download the ZIP from the Front-End Checklist skills page and unzip it into ~/.claude/skills/ for personal use or into a project's .claude/skills/ folder. In the Claude apps, upload the ZIP under Settings → Capabilities → Skills instead.

Is the find-npm-packages skill free to use?

The source identifies the item's licence as MIT. It does not mention pricing, so check the skills page for any cost details before you rely on it.

What do I need to run find-npm-packages?

You need Node.js and pnpm with the repository's pnpm validate:packages script, plus curl and jq. The agent also needs network access to registry.npmjs.org and api.npmjs.org.

Can I use this skill outside the Front-End Checklist repository?

The source says it is not intended for general coding or project work outside this repository, because the workflow depends on its file paths and validation script. Use it for checklist rules in that repository.

Does the skill check whether a package is secure?

No. The skill checks weekly download counts and last publish dates only. It does not check security advisories or licensing, so package choice needs a separate audit if it must be authoritative.

How is this different from just searching npm myself?

The skill applies fixed thresholds of more than 10,000 weekly downloads and a publish within 18 months, limits the result to 2-3 packages, and writes the names into the rule's frontmatter in a consistent format. Searching by hand gives you no such fixed filter.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

This skill suits maintainers and contributors to the Front-End Checklist repository who want consistent, quick npm package suggestions for a specific accessibility, performance or code-quality rule. It is a poor fit for general project work or for any case where package choice needs a security or licence audit, since it only checks downloads and publish dates.

Download the skill