Visitar URL original
chore(eslint.config): add scoped ESLint blocks to detect CommonJS and ESM mistakes by ravitejapioneerblaze-code · Pull Request #6980 · uswds/uswds · GitHub
Skip to content

chore(eslint.config): add scoped ESLint blocks to detect CommonJS and ESM mistakes - #6980

Open
ravitejapioneerblaze-code wants to merge 1 commit into
uswds:developfrom
ravitejapioneerblaze-code:feat/esm-eslint-rules-6849
Open

ravitejapioneerblaze-code wants to merge 1 commit into
uswds:developfrom
ravitejapioneerblaze-code:feat/esm-eslint-rules-6849

Conversation

@ravitejapioneerblaze-code

@ravitejapioneerblaze-code ravitejapioneerblaze-code commented Sep 19, 2026 •

Copy link
Copy Markdown
Contributor

Summary

Restructured eslint.config.mjs into scoped blocks so ESLint can
distinguish CommonJS files from ESM files and catch the most common
mistake during the CommonJS-to-ESM migration — named imports from a
module that only has a default export.

Breaking change

This is not a breaking change.

Related issue

Closes #6849

Problem statement

eslint.config.mjs was setting languageOptions.sourceType: "module" for
every file in packages/ while also injecting Node's require/module
globals for the same files. This meant ESLint could not distinguish a
CommonJS file from an ESM file and could not catch the most common
conversion mistake.

Solution

Added two new scoped config blocks:

ESM source block — applies to packages//*.js and packages//*.mjs
(excluding packages/usa-icon/src/usa-icons.config.js which is a
Node-side build config). Adds:

Node-tooling block — applies to gulpfile.js, tasks/**/*.js,
.storybook/main.js, .storybook/test-runner.js, svgo.config.js, webpack.twig.config.js, and
packages/usa-icon/src/usa-icons.config.js. Explicitly sets
sourceType: "commonjs" and disables ESM-only rules for files meant to
stay CommonJS permanently.

Major changes

  • eslint.config.mjs — added esmSourceConfig and nodeToolingConfig blocks

Testing and review

npm run lint:js passes with only the expected import/extensions warnings
on extensionless relative require() calls in packages/ — no new errors.

@github-actions

github-actions Bot commented Sep 19, 2026 •

Copy link
Copy Markdown
Contributor

✅ All commits on this PR have a verified signature. Thanks!

@coderabbitai

coderabbitai Bot commented Sep 19, 2026 •

Copy link
Copy Markdown

Review Change StackReview Change Stack

No actionable comments were generated in the recent review.

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Repository: uswds/uswds/.coderabbit.yaml

Review profile: QUIET

Plan: Advanced

Run ID: 0a1d4206-40be-402f-beae-ea7ed7f2b7af

📥 Commits

Reviewing files that changed from the base of the PR and between 20bdbe3 and 7958a61.

📒 Files selected for processing (1)
  • eslint.config.mjs

Included review availability: Your plan provides up to 10 included reviews per hour; 8 remain after this review.

📝 Summary

Summary by CodeRabbit

  • Chores
    • Updated code-quality checks to better support both modern modules and Node.js tooling.
    • Added consistency checks for import style, dependency cycles, and relative import paths.
    • Maintained compatibility for configuration files using the CommonJS module format.
    • Refined configuration guidance and organization to make linting behavior clearer and more predictable.

The ESLint configuration now separates package ESM sources from CommonJS Node tooling. ESM rules detect named-import errors and cycles and warn about missing extensions. Node-tooling files use CommonJS settings and retain Node globals.

Changes: ESLint module scoping

Layer / File(s) Summary
Scoped ESM and Node-tooling rules
eslint.config.mjs
The configuration adds scoped rules for package ESM files and CommonJS settings for Node-tooling files. It excludes the USA icon configuration from the ESM scope and exports both configurations.

Priority: Normal

Estimated code review effort: 3 (Moderate) | ~20 minutes

Change: Feature · Severity of issue fixed: Medium

Pre-merge checks: Passed 9 · Failed 1

Failed Failed checks: 1 warning

Check name Status Explanation Resolution
Linked Issues check Warning The configuration implements the ESM rules, the USA icon exclusion, the CommonJS tooling block, explicit Node globals, and the required warning-level import/extensions rule. The summary reports that… Include .storybook/preview.js or provide a separate, reviewable configuration that satisfies the issue's required .storybook/**/*.js coverage while preserving its actual module type. Then rerun npm run lint:js and confirm that no new …
Passed Passed checks: 9 passed
Check name Status Explanation
Out of Scope Changes check Passed The reviewed diff changes only eslint.config.mjs. The added blocks, rule overrides, and related comments support the scoped ESLint migration in issue #6849. No unrelated source conversion or unrelat…
Breaking Change Declared Passed The pull request description contains exactly one approved statement: “This is not a breaking change.” The authoritative diff changes only eslint.config.mjs; it does not change a package JavaScript …
No New Runtime Dependency Passed PASS. The pull request changes only eslint.config.mjs. The dependencies fields in both repository manifests are unchanged, and no files under packages/**/src/**/*.js changed. Therefore, the pull…
Regression Test Targets The Change Passed PASS: The review-scoped diff changes only eslint.config.mjs. It does not modify production JavaScript under packages/**/src/**/*.js, any packages/**/*.scss, or any test file. The PR changes ESLi…
New Api Surface Follow-Ups Passed PASS — The authoritative pull-request diff changes only eslint.config.mjs. It adds ESLint configuration blocks and rules, not a $theme-* setting, public Sass mixin or function, data-* attribute …
Accessibility Verification Declared Passed PASS — The pull request changes only eslint.config.mjs. The diff adds ESLint configuration and rules, with no changes to ARIA attributes, focus management, keyboard handling, screen reader text, or …
Theme Token Discipline Passed The pull request changes only eslint.config.mjs. The authoritative diff contains no *.scss file under packages/, so it introduces no theme-token values or declarations covered by this check.
Description check Passed The description directly explains the ESLint configuration changes, their purpose, scoped file behavior, and test result.
Title check Passed The title uses the required chore type and scope format, and it accurately describes the scoped ESLint configuration changes.
Full details: Out of Scope Changes check

Explanation

The reviewed diff changes only eslint.config.mjs. The added blocks, rule overrides, and related comments support the scoped ESLint migration in issue #6849. No unrelated source conversion or unrelated runtime behavior change is present.

Full details: Breaking Change Declared

Explanation

The pull request description contains exactly one approved statement: “This is not a breaking change.” The authoritative diff changes only eslint.config.mjs; it does not change a package JavaScript API, a Twig template, a .usa-* class, a $theme-* default, or built CSS behavior.

Full details: No New Runtime Dependency

Explanation

PASS. The pull request changes only eslint.config.mjs. The dependencies fields in both repository manifests are unchanged, and no files under packages/**/src/**/*.js changed. Therefore, the pull request adds neither a consumer dependency nor a new production import that could rely on a transitive dependency.

Full details: Regression Test Targets The Change

Explanation

PASS: The review-scoped diff changes only eslint.config.mjs. It does not modify production JavaScript under packages/**/src/**/*.js, any packages/**/*.scss, or any test file. The PR changes ESLint tooling configuration, so the regression-test requirement does not apply.

Full details: New Api Surface Follow-Ups

Explanation

PASS — The authoritative pull-request diff changes only eslint.config.mjs. It adds ESLint configuration blocks and rules, not a $theme-* setting, public Sass mixin or function, data-* attribute constant, or .usa-* class/modifier. Therefore this API-surface release checklist does not apply.

Full details: Accessibility Verification Declared

Explanation

PASS — The pull request changes only eslint.config.mjs. The diff adds ESLint configuration and rules, with no changes to ARIA attributes, focus management, keyboard handling, screen reader text, or form error association. The accessibility test matrix is therefore not applicable.

Full details: Linked Issues check

Explanation

The configuration implements the ESM rules, the USA icon exclusion, the CommonJS tooling block, explicit Node globals, and the required warning-level import/extensions rule. The summary reports that npm run lint:js passes with only expected warnings. However, issue #6849 requires the Node-tooling block to cover .storybook/**/*.js. The changed block covers only .storybook/main.js and .storybook/test-runner.js; .storybook/preview.js is explicitly excluded. The reviewed evidence does not show another CommonJS configuration for that required path.

Resolution

Include .storybook/preview.js or provide a separate, reviewable configuration that satisfies the issue's required .storybook/**/*.js coverage while preserving its actual module type. Then rerun npm run lint:js and confirm that no new errors occur.

  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@ravitejapioneerblaze-code ravitejapioneerblaze-code changed the title USWDS : Add ESLint rules that can detect CommonJS/ESM mistakes USWDS - JS: Add ESLint rules that can detect CommonJS/ESM mistakes Sep 19, 2026
@ravitejapioneerblaze-code ravitejapioneerblaze-code changed the title USWDS - JS: Add ESLint rules that can detect CommonJS/ESM mistakes feat(eslint): add scoped ESLint blocks to detect CommonJS and ESM mistakes Sep 19, 2026
@ravitejapioneerblaze-code ravitejapioneerblaze-code changed the title feat(eslint): add scoped ESLint blocks to detect CommonJS and ESM mistakes chore(eslint.config): add scoped ESLint blocks to detect CommonJS and ESM mistakes Sep 19, 2026
@github-actions github-actions Bot added the Needs: Author Response 🔴 Waiting on a specific author action; also used by commit-signature automation. label Oct 6, 2026
@github-actions github-actions Bot removed the Needs: Author Response 🔴 Waiting on a specific author action; also used by commit-signature automation. label Oct 6, 2026
@ravitejapioneerblaze-code

Copy link
Copy Markdown
Contributor Author

Hi team, the commit is now verified, and the Snyk step in circle-uswds is failing with an enrichment error (SNYK-CLI-0000) that looks unrelated to this change. Could someone re-run the workflow?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

USWDS - JS: Add ESLint rules that can detect CommonJS/ESM mistakes

1 participant