Skip to content

Widgets: Add TypeScript project config#78467

Merged
retrofox merged 7 commits into
trunkfrom
update/widgets-tsconfig
May 21, 2026
Merged

Widgets: Add TypeScript project config#78467
retrofox merged 7 commits into
trunkfrom
update/widgets-tsconfig

Conversation

@retrofox
Copy link
Copy Markdown
Contributor

@retrofox retrofox commented May 20, 2026

What?

  • Add widgets/tsconfig.json, a standalone TypeScript project that covers the sources under widgets/<name>/.
  • Document the optional widget package.json in the @wordpress/build README "Structure" section.

Part of #77616

Why?

widgets/ had no TypeScript project of its own, so widget .tsx files fell back to an inferred project: @wordpress/* imports, *.module.css imports, and JSX surfaced as errors in the editor even though the runtime code was correct. The dependency-resolution half of this gap was addressed in #78463, which gave each widget its own package.json; this adds the TypeScript half.

How?

  • widgets/tsconfig.json extends tsconfig.base.json with jsx: "react-jsx" (automatic runtime, no React import needed), rootDir: ".", noEmit with composite: false, and types: [ "style-imports" ] for CSS module imports.
  • It is intentionally not registered in the root tsconfig.json references: it is a standalone type-check project, not part of the incremental build graph.
  • The README gains one line listing package.json as an optional npm dependencies manifest in the widget structure tree (per review feedback on Widgets: Declare dependencies in a per-widget package.json #78463).

Testing

  1. npx tsc -p widgets/tsconfig.json completes with no errors.
  2. npm run lint:tsconfig passes.
  3. Open any widgets/<name>/*.tsx in the editor: @wordpress/* imports, *.module.css imports, and JSX resolve.
Before After
image image

retrofox added 2 commits May 20, 2026 14:35
resolve @wordpress/*, CSS module imports, and JSX in widget .tsx files
list it in the widgets Structure tree as an optional npm dependencies manifest
@retrofox retrofox self-assigned this May 20, 2026
@github-actions
Copy link
Copy Markdown

github-actions Bot commented May 20, 2026

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: retrofox <retrofox@git.wordpress.org>
Co-authored-by: simison <simison@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@retrofox retrofox requested a review from simison May 20, 2026 13:44
@retrofox retrofox added [Type] Experimental Experimental feature or API. [Feature] Dashboard WordPress admin dashboard, widget framework, and layout customization labels May 20, 2026
@github-actions
Copy link
Copy Markdown

github-actions Bot commented May 20, 2026

Flaky tests detected in 355d0ae.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/26238269638
📝 Reported issues:

@simison
Copy link
Copy Markdown
Member

simison commented May 21, 2026

Do we need to add widgets path to the list at tsconfig.json to ensure build checks widgets in CI as well?

@simison simison added [Type] Build Tooling Issues or PRs related to build tooling and removed [Type] Experimental Experimental feature or API. labels May 21, 2026
@retrofox
Copy link
Copy Markdown
Contributor Author

Do we need to add widgets path to the list at tsconfig.json to ensure build checks widgets in CI as well?

Good catch, you're right. Added widgets to the root tsconfig.json references, so the "Type checking" CI step (tsgo --build) now picks it up. Verified locally that the widgets project builds clean as a reference.

This follows the setup of the other non-package-type-check configs already in that list (storybook, test/e2e, test/performance, test/storybook-playwright), which are referenced explicitly so CI checks them. widgets/tsconfig.json is noEmit + composite: false like test/storybook-playwright, so it slots in directly.

@retrofox retrofox merged commit db5c55f into trunk May 21, 2026
39 checks passed
@retrofox retrofox deleted the update/widgets-tsconfig branch May 21, 2026 16:52
@github-actions github-actions Bot added this to the Gutenberg 23.3 milestone May 21, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Feature] Dashboard WordPress admin dashboard, widget framework, and layout customization [Type] Build Tooling Issues or PRs related to build tooling

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants