Fix ESM compatibility in .storybook/main.js by Copilot · Pull Request #3005 · primer/css

Copilot · 2026-03-12T17:36:22Z

docs/.storybook/main.js used require('sass') (CJS) while the project is configured as "type": "module", causing Storybook to fail with ReferenceError: require is not defined in ES module scope.

Change

Replace inline require() with a top-level ESM import:

// Before
implementation: require('sass')

// After
import sass from 'sass'
// ...
implementation: sass

What should reviewers focus on?

No behavioral change — purely a module syntax fix to align with the project's ESM configuration.

Can these changes ship as is?

Yes, this PR does not depend on additional changes. 🚢

Original prompt

Fix the failing GitHub Actions workflow Deploy preview / Build
Analyze the workflow logs, identify the root cause of the failure, and implement a fix.
Job ID: 66837132510
Job URL: https://github.com/primer/css/actions/runs/23014849662/job/66837132510

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

changeset-bot · 2026-03-12T17:36:29Z

⚠️ No Changeset found

Latest commit: c0daf21

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

…n.js Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com>

* Initial plan * Initial plan for fixing storybook build failures Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> * Fix Storybook 10 build: update packages, add SCSS/Babel/docs support, fix compat shims Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> * Address code review: remove unused assert dep, rename config var, clean up shim script Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> * Fix docs npm install failure due to storybook peer dependency conflicts (#3008) * Initial plan * fix: resolve storybook peer dependency conflicts in docs install - Update @geometricpanda/storybook-addon-badges to ^2.0.5 which supports @storybook/blocks@^8.3.0 (v2.0.0 only supported ^7.0.0) - Add docs/.npmrc with legacy-peer-deps=true to handle the intentional mixed storybook 8/10 package setup used by shims and webpack aliases Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com>

…ybook script (#3004) * Bump tar and storybook in /docs Removes [tar](https://github.com/isaacs/node-tar). It's no longer used after updating ancestor dependency [storybook](https://github.com/storybookjs/storybook/tree/HEAD/code/core). These dependencies need to be updated together. Removes `tar` Updates `storybook` from 7.6.21 to 10.2.17 - [Release notes](https://github.com/storybookjs/storybook/releases) - [Changelog](https://github.com/storybookjs/storybook/blob/next/CHANGELOG.md) - [Commits](https://github.com/storybookjs/storybook/commits/v10.2.17/code/core) --- updated-dependencies: - dependency-name: tar dependency-version: dependency-type: indirect - dependency-name: storybook dependency-version: 10.2.17 dependency-type: direct:production ... Signed-off-by: dependabot[bot] <support@github.com> * Initial plan * Fix storybook build: remove invalid positional argument `public/static` Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> * Fix ESM compatibility in .storybook/main.js (#3005) * Initial plan * Fix ESM compatibility: replace require('sass') with ESM import in main.js Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> * Fix Storybook 10 build: complete v7→v10 migration (#3007) * Initial plan * Initial plan for fixing storybook build failures Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> * Fix Storybook 10 build: update packages, add SCSS/Babel/docs support, fix compat shims Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> * Address code review: remove unused assert dep, rename config var, clean up shim script Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> * Fix docs npm install failure due to storybook peer dependency conflicts (#3008) * Initial plan * fix: resolve storybook peer dependency conflicts in docs install - Update @geometricpanda/storybook-addon-badges to ^2.0.5 which supports @storybook/blocks@^8.3.0 (v2.0.0 only supported ^7.0.0) - Add docs/.npmrc with legacy-peer-deps=true to handle the intentional mixed storybook 8/10 package setup used by shims and webpack aliases Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> * fix: regenerate docs/package-lock.json to resolve storybook binary not found (#3009) * Initial plan * fix: regenerate docs/package-lock.json to fix storybook binary not found Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com> --------- Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com>

Initial plan

fc5c014

Copilot AI assigned Copilot and llastflowers Mar 12, 2026

Copilot started work on behalf of llastflowers March 12, 2026 17:36 View session

Fix ESM compatibility: replace require('sass') with ESM import in mai…

7d22baa

…n.js Co-authored-by: llastflowers <55068883+llastflowers@users.noreply.github.com>

Copilot AI changed the title ~~[WIP] [66837132510] Fix failing GitHub Actions workflow~~ Fix ESM compatibility in .storybook/main.js Mar 12, 2026

Copilot AI requested a review from llastflowers March 12, 2026 17:39

Copilot finished work on behalf of llastflowers March 12, 2026 17:39

llastflowers added the skip changeset label Mar 12, 2026

llastflowers temporarily deployed to github-pages March 12, 2026 20:16 — with GitHub Actions Inactive

github-actions Bot temporarily deployed to Storybook Preview March 12, 2026 20:17 Inactive

llastflowers approved these changes Mar 12, 2026

View reviewed changes

llastflowers marked this pull request as ready for review March 12, 2026 20:18

llastflowers requested review from a team as code owners March 12, 2026 20:18

llastflowers requested a review from francinelucca March 12, 2026 20:18

llastflowers merged commit 542be9b into copilot/fix-github-actions-workflow-another-one Mar 12, 2026
14 checks passed

llastflowers deleted the copilot/66837132510-fix-github-actions-workflow branch March 12, 2026 20:18

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fix ESM compatibility in .storybook/main.js#3005

Fix ESM compatibility in .storybook/main.js#3005
llastflowers merged 3 commits intocopilot/fix-github-actions-workflow-another-onefrom
copilot/66837132510-fix-github-actions-workflow

Copilot AI commented Mar 12, 2026 •

edited

Loading

Uh oh!

changeset-bot Bot commented Mar 12, 2026 •

edited

Loading

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

Copilot AI commented Mar 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Change

What should reviewers focus on?

Can these changes ship as is?

Uh oh!

changeset-bot Bot commented Mar 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

⚠️ No Changeset found

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Copilot AI commented Mar 12, 2026 •

edited

Loading

changeset-bot Bot commented Mar 12, 2026 •

edited

Loading