feat(emotion): add emotion plugin by sapphi-red · Pull Request #15 · rolldown/plugins

sapphi-red · 2026-03-14T15:10:38Z

This PR adds @rolldown/plugin-emotion which utilizes Rolldown's native magic string feature.

In the synthetic benchmark included in this PR, this plugin is

1.30x faster than using @swc/plugin-emotion + @rollup/plugin-swc
2.64x faster than using @emotion/babel-plugin + @rolldown/plugin-babel

In a real world case, I tested with https://github.com/vanilla/vanilla/tree/release/2025.010 which I found in the GitHub search. Using this plugin was ~10% faster compared to Vite 8 +@swc/plugin-emotion + @rollup/plugin-swc.

The implementation is based on swc-project/plugins/packages/emotion (Apache License 2.0) and test cases are also adapted from it.

This PR also includes an internal package named oxc-unshadowed-visitor which make it easier to find varaibles that are imported.

…nternal package

Copilot

Pull request overview

This PR introduces a new @rolldown/plugin-emotion package that transforms Emotion css/styled usage using Rolldown’s native magic string support, and adds supporting infra (fixtures/benchmarks, an internal scope-aware visitor, and e2e examples) to validate behavior and measure performance.

Changes:

Added @rolldown/plugin-emotion implementation (imports tracking, label generation, sourcemap injection, CSS minification) plus extensive fixtures-based tests.
Added internal @rolldown/oxc-unshadowed-visitor package to detect unshadowed references in a single pass.
Expanded repo tooling/config to include internal packages, benchmarks, and Playwright-based examples in workspace + CI.

Reviewed changes

Copilot reviewed 183 out of 186 changed files in this pull request and generated 9 comments.

Show a summary per file

File	Description
`vitest.config.ts`	Expands Vitest projects to include internal packages, benchmarks, and examples.
`tsconfig.json`	Converts root TS config to a solution config referencing shared + examples configs.
`tsconfig.common.json`	Introduces shared TS compiler options for packages (excludes examples).
`pnpm-workspace.yaml`	Adds benchmarks, internal packages, and examples to the workspace.
`packages/emotion/vitest.config.ts`	Adds a dedicated Vitest project for the emotion package.
`packages/emotion/tsdown.config.ts`	Adds tsdown build config for the new plugin package.
`packages/emotion/src/index.ts`	Core plugin implementation: transforms `css`/`styled`/`Global` patterns, labels, targets, and sourcemaps.
`packages/emotion/src/types.ts`	Defines public plugin option types, including `importMap` and label formatting.
`packages/emotion/src/import-map.ts`	Maps imports/specifiers to Emotion expression kinds to decide what to transform.
`packages/emotion/src/label.ts`	Implements label sanitization and label template expansion.
`packages/emotion/src/source-map.ts`	Inline sourcemap generation + offset-to-line/column mapping.
`packages/emotion/src/css-minify.ts`	CSS template minification (comments/whitespace compaction).
`packages/emotion/src/css-minify.test.ts`	Unit tests for the CSS minifier.
`packages/emotion/tests/transform.test.ts`	Fixture runner that builds via Rolldown and snapshots outputs.
`packages/emotion/tests/fixtures/**`	Adds many fixture inputs/expected outputs for transform coverage.
`packages/emotion/tests/fixtures-labels/**`	Adds many label-focused fixtures/expected outputs.
`packages/emotion/package.json`	Declares the new published plugin package metadata and deps/peers.
`packages/emotion/README.md`	Documents usage, options, and benchmark results for the plugin.
`packages/emotion/LICENSE`	Adds a license file placeholder for the package.
`packages/emotion/benchmark/**`	Adds a benchmark package (generator, app, build configs, vitest bench).
`packages/babel/tsdown.config.ts`	Aligns Babel package DTS generation to shared TS config.
`internal-packages/oxc-unshadowed-visitor/**`	Adds the internal scope-aware visitor package + tests + bench.
`internal-packages/swc-output-gen/**`	Adds an internal tool to generate `output.swc.js` for fixtures using SWC plugins.
`internal-packages/benchmark-utils/**`	Adds a seeded RNG utility for deterministic benchmark generation.
`examples/**`	Adds Playwright-backed E2E test harness + an Emotion example app.
`.oxlintrc.json`	Disables `no-shadow` and ignores fixtures/benchmarks for linting.
`.oxfmtrc.json`	Ignores fixtures directories in formatting.
`.gitignore`	Ignores `.swc`, temporary examples dirs, and generated SWC outputs.
`.github/workflows/ci.yml`	Installs Playwright Chromium in CI to support the new examples tests.
`.gitattributes`	Forces LF checkout to stabilize hash-based class name generation.
`package.json`	Adds `test:e2e` and `generate:swc-outputs` scripts.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

+export function getPos(source: string, offset: number): { line: number; column: number } {
+ let line = 0
+ let column = 0
+ for (let i = 0; i < offset && i < source.length; i++) {
+ if (source.charCodeAt(i) === LF) {
+ line++
+ column = 0
+ } else {
+ column++
+ }
+ }
+ return { line, column }


+import type { ESTree } from 'rolldown/utils'
+import { ExprKind } from './common'
+import type { ImportMapConfig } from './types'


sapphi-red · 2026-03-14T15:10:38Z

This PR adds @rolldown/plugin-emotion which utilizes Rolldown's native magic string feature.

In the synthetic benchmark included in this PR, this plugin is

1.30x faster than using @swc/plugin-emotion + @rollup/plugin-swc
2.64x faster than using @emotion/babel-plugin + @rolldown/plugin-babel

In a real world case, I tested with https://github.com/vanilla/vanilla/tree/release/2025.010 which I found in the GitHub search. Using this plugin was ~10% faster compared to Vite 8 +@swc/plugin-emotion + @rollup/plugin-swc.

The implementation is based on swc-project/plugins/packages/emotion (Apache License 2.0) and test cases are also adapted from it.

This PR also includes an internal package named oxc-unshadowed-visitor which make it easier to find varaibles that are imported.

…nternal package

Copilot

Pull request overview

This PR introduces a new @rolldown/plugin-emotion package that transforms Emotion css/styled usage using Rolldown’s native magic string support, and adds supporting infra (fixtures/benchmarks, an internal scope-aware visitor, and e2e examples) to validate behavior and measure performance.

Changes:

Added @rolldown/plugin-emotion implementation (imports tracking, label generation, sourcemap injection, CSS minification) plus extensive fixtures-based tests.
Added internal @rolldown/oxc-unshadowed-visitor package to detect unshadowed references in a single pass.
Expanded repo tooling/config to include internal packages, benchmarks, and Playwright-based examples in workspace + CI.

Reviewed changes

Copilot reviewed 183 out of 186 changed files in this pull request and generated 9 comments.

Show a summary per file

File	Description
`vitest.config.ts`	Expands Vitest projects to include internal packages, benchmarks, and examples.
`tsconfig.json`	Converts root TS config to a solution config referencing shared + examples configs.
`tsconfig.common.json`	Introduces shared TS compiler options for packages (excludes examples).
`pnpm-workspace.yaml`	Adds benchmarks, internal packages, and examples to the workspace.
`packages/emotion/vitest.config.ts`	Adds a dedicated Vitest project for the emotion package.
`packages/emotion/tsdown.config.ts`	Adds tsdown build config for the new plugin package.
`packages/emotion/src/index.ts`	Core plugin implementation: transforms `css`/`styled`/`Global` patterns, labels, targets, and sourcemaps.
`packages/emotion/src/types.ts`	Defines public plugin option types, including `importMap` and label formatting.
`packages/emotion/src/import-map.ts`	Maps imports/specifiers to Emotion expression kinds to decide what to transform.
`packages/emotion/src/label.ts`	Implements label sanitization and label template expansion.
`packages/emotion/src/source-map.ts`	Inline sourcemap generation + offset-to-line/column mapping.
`packages/emotion/src/css-minify.ts`	CSS template minification (comments/whitespace compaction).
`packages/emotion/src/css-minify.test.ts`	Unit tests for the CSS minifier.
`packages/emotion/tests/transform.test.ts`	Fixture runner that builds via Rolldown and snapshots outputs.
`packages/emotion/tests/fixtures/**`	Adds many fixture inputs/expected outputs for transform coverage.
`packages/emotion/tests/fixtures-labels/**`	Adds many label-focused fixtures/expected outputs.
`packages/emotion/package.json`	Declares the new published plugin package metadata and deps/peers.
`packages/emotion/README.md`	Documents usage, options, and benchmark results for the plugin.
`packages/emotion/LICENSE`	Adds a license file placeholder for the package.
`packages/emotion/benchmark/**`	Adds a benchmark package (generator, app, build configs, vitest bench).
`packages/babel/tsdown.config.ts`	Aligns Babel package DTS generation to shared TS config.
`internal-packages/oxc-unshadowed-visitor/**`	Adds the internal scope-aware visitor package + tests + bench.
`internal-packages/swc-output-gen/**`	Adds an internal tool to generate `output.swc.js` for fixtures using SWC plugins.
`internal-packages/benchmark-utils/**`	Adds a seeded RNG utility for deterministic benchmark generation.
`examples/**`	Adds Playwright-backed E2E test harness + an Emotion example app.
`.oxlintrc.json`	Disables `no-shadow` and ignores fixtures/benchmarks for linting.
`.oxfmtrc.json`	Ignores fixtures directories in formatting.
`.gitignore`	Ignores `.swc`, temporary examples dirs, and generated SWC outputs.
`.github/workflows/ci.yml`	Installs Playwright Chromium in CI to support the new examples tests.
`.gitattributes`	Forces LF checkout to stabilize hash-based class name generation.
`package.json`	Adds `test:e2e` and `generate:swc-outputs` scripts.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

+export function getPos(source: string, offset: number): { line: number; column: number } {
+ let line = 0
+ let column = 0
+ for (let i = 0; i < offset && i < source.length; i++) {
+ if (source.charCodeAt(i) === LF) {
+ line++
+ column = 0
+ } else {
+ column++
+ }
+ }
+ return { line, column }


+import type { ESTree } from 'rolldown/utils'
+import { ExprKind } from './common'
+import type { ImportMapConfig } from './types'


sapphi-red · 2026-03-14T15:10:38Z

This PR adds @rolldown/plugin-emotion which utilizes Rolldown's native magic string feature.

In the synthetic benchmark included in this PR, this plugin is

1.30x faster than using @swc/plugin-emotion + @rollup/plugin-swc
2.64x faster than using @emotion/babel-plugin + @rolldown/plugin-babel

In a real world case, I tested with https://github.com/vanilla/vanilla/tree/release/2025.010 which I found in the GitHub search. Using this plugin was ~10% faster compared to Vite 8 +@swc/plugin-emotion + @rollup/plugin-swc.

The implementation is based on swc-project/plugins/packages/emotion (Apache License 2.0) and test cases are also adapted from it.

This PR also includes an internal package named oxc-unshadowed-visitor which make it easier to find varaibles that are imported.

…nternal package

Copilot

Pull request overview

This PR introduces a new @rolldown/plugin-emotion package that transforms Emotion css/styled usage using Rolldown’s native magic string support, and adds supporting infra (fixtures/benchmarks, an internal scope-aware visitor, and e2e examples) to validate behavior and measure performance.

Changes:

Added @rolldown/plugin-emotion implementation (imports tracking, label generation, sourcemap injection, CSS minification) plus extensive fixtures-based tests.
Added internal @rolldown/oxc-unshadowed-visitor package to detect unshadowed references in a single pass.
Expanded repo tooling/config to include internal packages, benchmarks, and Playwright-based examples in workspace + CI.

Reviewed changes

Copilot reviewed 183 out of 186 changed files in this pull request and generated 9 comments.

Show a summary per file

File	Description
`vitest.config.ts`	Expands Vitest projects to include internal packages, benchmarks, and examples.
`tsconfig.json`	Converts root TS config to a solution config referencing shared + examples configs.
`tsconfig.common.json`	Introduces shared TS compiler options for packages (excludes examples).
`pnpm-workspace.yaml`	Adds benchmarks, internal packages, and examples to the workspace.
`packages/emotion/vitest.config.ts`	Adds a dedicated Vitest project for the emotion package.
`packages/emotion/tsdown.config.ts`	Adds tsdown build config for the new plugin package.
`packages/emotion/src/index.ts`	Core plugin implementation: transforms `css`/`styled`/`Global` patterns, labels, targets, and sourcemaps.
`packages/emotion/src/types.ts`	Defines public plugin option types, including `importMap` and label formatting.
`packages/emotion/src/import-map.ts`	Maps imports/specifiers to Emotion expression kinds to decide what to transform.
`packages/emotion/src/label.ts`	Implements label sanitization and label template expansion.
`packages/emotion/src/source-map.ts`	Inline sourcemap generation + offset-to-line/column mapping.
`packages/emotion/src/css-minify.ts`	CSS template minification (comments/whitespace compaction).
`packages/emotion/src/css-minify.test.ts`	Unit tests for the CSS minifier.
`packages/emotion/tests/transform.test.ts`	Fixture runner that builds via Rolldown and snapshots outputs.
`packages/emotion/tests/fixtures/**`	Adds many fixture inputs/expected outputs for transform coverage.
`packages/emotion/tests/fixtures-labels/**`	Adds many label-focused fixtures/expected outputs.
`packages/emotion/package.json`	Declares the new published plugin package metadata and deps/peers.
`packages/emotion/README.md`	Documents usage, options, and benchmark results for the plugin.
`packages/emotion/LICENSE`	Adds a license file placeholder for the package.
`packages/emotion/benchmark/**`	Adds a benchmark package (generator, app, build configs, vitest bench).
`packages/babel/tsdown.config.ts`	Aligns Babel package DTS generation to shared TS config.
`internal-packages/oxc-unshadowed-visitor/**`	Adds the internal scope-aware visitor package + tests + bench.
`internal-packages/swc-output-gen/**`	Adds an internal tool to generate `output.swc.js` for fixtures using SWC plugins.
`internal-packages/benchmark-utils/**`	Adds a seeded RNG utility for deterministic benchmark generation.
`examples/**`	Adds Playwright-backed E2E test harness + an Emotion example app.
`.oxlintrc.json`	Disables `no-shadow` and ignores fixtures/benchmarks for linting.
`.oxfmtrc.json`	Ignores fixtures directories in formatting.
`.gitignore`	Ignores `.swc`, temporary examples dirs, and generated SWC outputs.
`.github/workflows/ci.yml`	Installs Playwright Chromium in CI to support the new examples tests.
`.gitattributes`	Forces LF checkout to stabilize hash-based class name generation.
`package.json`	Adds `test:e2e` and `generate:swc-outputs` scripts.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

+export function getPos(source: string, offset: number): { line: number; column: number } {
+ let line = 0
+ let column = 0
+ for (let i = 0; i < offset && i < source.length; i++) {
+ if (source.charCodeAt(i) === LF) {
+ line++
+ column = 0
+ } else {
+ column++
+ }
+ }
+ return { line, column }


+import type { ESTree } from 'rolldown/utils'
+import { ExprKind } from './common'
+import type { ImportMapConfig } from './types'


sapphi-red · 2026-03-14T15:10:38Z

This PR adds @rolldown/plugin-emotion which utilizes Rolldown's native magic string feature.

In the synthetic benchmark included in this PR, this plugin is

1.30x faster than using @swc/plugin-emotion + @rollup/plugin-swc
2.64x faster than using @emotion/babel-plugin + @rolldown/plugin-babel

In a real world case, I tested with https://github.com/vanilla/vanilla/tree/release/2025.010 which I found in the GitHub search. Using this plugin was ~10% faster compared to Vite 8 +@swc/plugin-emotion + @rollup/plugin-swc.

The implementation is based on swc-project/plugins/packages/emotion (Apache License 2.0) and test cases are also adapted from it.

This PR also includes an internal package named oxc-unshadowed-visitor which make it easier to find varaibles that are imported.

…nternal package

Copilot

Pull request overview

This PR introduces a new @rolldown/plugin-emotion package that transforms Emotion css/styled usage using Rolldown’s native magic string support, and adds supporting infra (fixtures/benchmarks, an internal scope-aware visitor, and e2e examples) to validate behavior and measure performance.

Changes:

Added @rolldown/plugin-emotion implementation (imports tracking, label generation, sourcemap injection, CSS minification) plus extensive fixtures-based tests.
Added internal @rolldown/oxc-unshadowed-visitor package to detect unshadowed references in a single pass.
Expanded repo tooling/config to include internal packages, benchmarks, and Playwright-based examples in workspace + CI.

Reviewed changes

Copilot reviewed 183 out of 186 changed files in this pull request and generated 9 comments.

Show a summary per file

File	Description
`vitest.config.ts`	Expands Vitest projects to include internal packages, benchmarks, and examples.
`tsconfig.json`	Converts root TS config to a solution config referencing shared + examples configs.
`tsconfig.common.json`	Introduces shared TS compiler options for packages (excludes examples).
`pnpm-workspace.yaml`	Adds benchmarks, internal packages, and examples to the workspace.
`packages/emotion/vitest.config.ts`	Adds a dedicated Vitest project for the emotion package.
`packages/emotion/tsdown.config.ts`	Adds tsdown build config for the new plugin package.
`packages/emotion/src/index.ts`	Core plugin implementation: transforms `css`/`styled`/`Global` patterns, labels, targets, and sourcemaps.
`packages/emotion/src/types.ts`	Defines public plugin option types, including `importMap` and label formatting.
`packages/emotion/src/import-map.ts`	Maps imports/specifiers to Emotion expression kinds to decide what to transform.
`packages/emotion/src/label.ts`	Implements label sanitization and label template expansion.
`packages/emotion/src/source-map.ts`	Inline sourcemap generation + offset-to-line/column mapping.
`packages/emotion/src/css-minify.ts`	CSS template minification (comments/whitespace compaction).
`packages/emotion/src/css-minify.test.ts`	Unit tests for the CSS minifier.
`packages/emotion/tests/transform.test.ts`	Fixture runner that builds via Rolldown and snapshots outputs.
`packages/emotion/tests/fixtures/**`	Adds many fixture inputs/expected outputs for transform coverage.
`packages/emotion/tests/fixtures-labels/**`	Adds many label-focused fixtures/expected outputs.
`packages/emotion/package.json`	Declares the new published plugin package metadata and deps/peers.
`packages/emotion/README.md`	Documents usage, options, and benchmark results for the plugin.
`packages/emotion/LICENSE`	Adds a license file placeholder for the package.
`packages/emotion/benchmark/**`	Adds a benchmark package (generator, app, build configs, vitest bench).
`packages/babel/tsdown.config.ts`	Aligns Babel package DTS generation to shared TS config.
`internal-packages/oxc-unshadowed-visitor/**`	Adds the internal scope-aware visitor package + tests + bench.
`internal-packages/swc-output-gen/**`	Adds an internal tool to generate `output.swc.js` for fixtures using SWC plugins.
`internal-packages/benchmark-utils/**`	Adds a seeded RNG utility for deterministic benchmark generation.
`examples/**`	Adds Playwright-backed E2E test harness + an Emotion example app.
`.oxlintrc.json`	Disables `no-shadow` and ignores fixtures/benchmarks for linting.
`.oxfmtrc.json`	Ignores fixtures directories in formatting.
`.gitignore`	Ignores `.swc`, temporary examples dirs, and generated SWC outputs.
`.github/workflows/ci.yml`	Installs Playwright Chromium in CI to support the new examples tests.
`.gitattributes`	Forces LF checkout to stabilize hash-based class name generation.
`package.json`	Adds `test:e2e` and `generate:swc-outputs` scripts.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

+export function getPos(source: string, offset: number): { line: number; column: number } {
+ let line = 0
+ let column = 0
+ for (let i = 0; i < offset && i < source.length; i++) {
+ if (source.charCodeAt(i) === LF) {
+ line++
+ column = 0
+ } else {
+ column++
+ }
+ }
+ return { line, column }


+import type { ESTree } from 'rolldown/utils'
+import { ExprKind } from './common'
+import type { ImportMapConfig } from './types'


sapphi-red · 2026-03-14T15:10:38Z

This PR adds @rolldown/plugin-emotion which utilizes Rolldown's native magic string feature.

In the synthetic benchmark included in this PR, this plugin is

1.30x faster than using @swc/plugin-emotion + @rollup/plugin-swc
2.64x faster than using @emotion/babel-plugin + @rolldown/plugin-babel

In a real world case, I tested with https://github.com/vanilla/vanilla/tree/release/2025.010 which I found in the GitHub search. Using this plugin was ~10% faster compared to Vite 8 +@swc/plugin-emotion + @rollup/plugin-swc.

The implementation is based on swc-project/plugins/packages/emotion (Apache License 2.0) and test cases are also adapted from it.

This PR also includes an internal package named oxc-unshadowed-visitor which make it easier to find varaibles that are imported.

…nternal package

Copilot

Pull request overview

This PR introduces a new @rolldown/plugin-emotion package that transforms Emotion css/styled usage using Rolldown’s native magic string support, and adds supporting infra (fixtures/benchmarks, an internal scope-aware visitor, and e2e examples) to validate behavior and measure performance.

Changes:

Added @rolldown/plugin-emotion implementation (imports tracking, label generation, sourcemap injection, CSS minification) plus extensive fixtures-based tests.
Added internal @rolldown/oxc-unshadowed-visitor package to detect unshadowed references in a single pass.
Expanded repo tooling/config to include internal packages, benchmarks, and Playwright-based examples in workspace + CI.

Reviewed changes

Copilot reviewed 183 out of 186 changed files in this pull request and generated 9 comments.

Show a summary per file

File	Description
`vitest.config.ts`	Expands Vitest projects to include internal packages, benchmarks, and examples.
`tsconfig.json`	Converts root TS config to a solution config referencing shared + examples configs.
`tsconfig.common.json`	Introduces shared TS compiler options for packages (excludes examples).
`pnpm-workspace.yaml`	Adds benchmarks, internal packages, and examples to the workspace.
`packages/emotion/vitest.config.ts`	Adds a dedicated Vitest project for the emotion package.
`packages/emotion/tsdown.config.ts`	Adds tsdown build config for the new plugin package.
`packages/emotion/src/index.ts`	Core plugin implementation: transforms `css`/`styled`/`Global` patterns, labels, targets, and sourcemaps.
`packages/emotion/src/types.ts`	Defines public plugin option types, including `importMap` and label formatting.
`packages/emotion/src/import-map.ts`	Maps imports/specifiers to Emotion expression kinds to decide what to transform.
`packages/emotion/src/label.ts`	Implements label sanitization and label template expansion.
`packages/emotion/src/source-map.ts`	Inline sourcemap generation + offset-to-line/column mapping.
`packages/emotion/src/css-minify.ts`	CSS template minification (comments/whitespace compaction).
`packages/emotion/src/css-minify.test.ts`	Unit tests for the CSS minifier.
`packages/emotion/tests/transform.test.ts`	Fixture runner that builds via Rolldown and snapshots outputs.
`packages/emotion/tests/fixtures/**`	Adds many fixture inputs/expected outputs for transform coverage.
`packages/emotion/tests/fixtures-labels/**`	Adds many label-focused fixtures/expected outputs.
`packages/emotion/package.json`	Declares the new published plugin package metadata and deps/peers.
`packages/emotion/README.md`	Documents usage, options, and benchmark results for the plugin.
`packages/emotion/LICENSE`	Adds a license file placeholder for the package.
`packages/emotion/benchmark/**`	Adds a benchmark package (generator, app, build configs, vitest bench).
`packages/babel/tsdown.config.ts`	Aligns Babel package DTS generation to shared TS config.
`internal-packages/oxc-unshadowed-visitor/**`	Adds the internal scope-aware visitor package + tests + bench.
`internal-packages/swc-output-gen/**`	Adds an internal tool to generate `output.swc.js` for fixtures using SWC plugins.
`internal-packages/benchmark-utils/**`	Adds a seeded RNG utility for deterministic benchmark generation.
`examples/**`	Adds Playwright-backed E2E test harness + an Emotion example app.
`.oxlintrc.json`	Disables `no-shadow` and ignores fixtures/benchmarks for linting.
`.oxfmtrc.json`	Ignores fixtures directories in formatting.
`.gitignore`	Ignores `.swc`, temporary examples dirs, and generated SWC outputs.
`.github/workflows/ci.yml`	Installs Playwright Chromium in CI to support the new examples tests.
`.gitattributes`	Forces LF checkout to stabilize hash-based class name generation.
`package.json`	Adds `test:e2e` and `generate:swc-outputs` scripts.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

+export function getPos(source: string, offset: number): { line: number; column: number } {
+ let line = 0
+ let column = 0
+ for (let i = 0; i < offset && i < source.length; i++) {
+ if (source.charCodeAt(i) === LF) {
+ line++
+ column = 0
+ } else {
+ column++
+ }
+ }
+ return { line, column }


+import type { ESTree } from 'rolldown/utils'
+import { ExprKind } from './common'
+import type { ImportMapConfig } from './types'


sapphi-red · 2026-03-14T15:10:38Z

This PR adds @rolldown/plugin-emotion which utilizes Rolldown's native magic string feature.

In the synthetic benchmark included in this PR, this plugin is

1.30x faster than using @swc/plugin-emotion + @rollup/plugin-swc
2.64x faster than using @emotion/babel-plugin + @rolldown/plugin-babel

In a real world case, I tested with https://github.com/vanilla/vanilla/tree/release/2025.010 which I found in the GitHub search. Using this plugin was ~10% faster compared to Vite 8 +@swc/plugin-emotion + @rollup/plugin-swc.

The implementation is based on swc-project/plugins/packages/emotion (Apache License 2.0) and test cases are also adapted from it.

This PR also includes an internal package named oxc-unshadowed-visitor which make it easier to find varaibles that are imported.

…nternal package

Copilot

Pull request overview

This PR introduces a new @rolldown/plugin-emotion package that transforms Emotion css/styled usage using Rolldown’s native magic string support, and adds supporting infra (fixtures/benchmarks, an internal scope-aware visitor, and e2e examples) to validate behavior and measure performance.

Changes:

Added @rolldown/plugin-emotion implementation (imports tracking, label generation, sourcemap injection, CSS minification) plus extensive fixtures-based tests.
Added internal @rolldown/oxc-unshadowed-visitor package to detect unshadowed references in a single pass.
Expanded repo tooling/config to include internal packages, benchmarks, and Playwright-based examples in workspace + CI.

Reviewed changes

Copilot reviewed 183 out of 186 changed files in this pull request and generated 9 comments.

Show a summary per file

File	Description
`vitest.config.ts`	Expands Vitest projects to include internal packages, benchmarks, and examples.
`tsconfig.json`	Converts root TS config to a solution config referencing shared + examples configs.
`tsconfig.common.json`	Introduces shared TS compiler options for packages (excludes examples).
`pnpm-workspace.yaml`	Adds benchmarks, internal packages, and examples to the workspace.
`packages/emotion/vitest.config.ts`	Adds a dedicated Vitest project for the emotion package.
`packages/emotion/tsdown.config.ts`	Adds tsdown build config for the new plugin package.
`packages/emotion/src/index.ts`	Core plugin implementation: transforms `css`/`styled`/`Global` patterns, labels, targets, and sourcemaps.
`packages/emotion/src/types.ts`	Defines public plugin option types, including `importMap` and label formatting.
`packages/emotion/src/import-map.ts`	Maps imports/specifiers to Emotion expression kinds to decide what to transform.
`packages/emotion/src/label.ts`	Implements label sanitization and label template expansion.
`packages/emotion/src/source-map.ts`	Inline sourcemap generation + offset-to-line/column mapping.
`packages/emotion/src/css-minify.ts`	CSS template minification (comments/whitespace compaction).
`packages/emotion/src/css-minify.test.ts`	Unit tests for the CSS minifier.
`packages/emotion/tests/transform.test.ts`	Fixture runner that builds via Rolldown and snapshots outputs.
`packages/emotion/tests/fixtures/**`	Adds many fixture inputs/expected outputs for transform coverage.
`packages/emotion/tests/fixtures-labels/**`	Adds many label-focused fixtures/expected outputs.
`packages/emotion/package.json`	Declares the new published plugin package metadata and deps/peers.
`packages/emotion/README.md`	Documents usage, options, and benchmark results for the plugin.
`packages/emotion/LICENSE`	Adds a license file placeholder for the package.
`packages/emotion/benchmark/**`	Adds a benchmark package (generator, app, build configs, vitest bench).
`packages/babel/tsdown.config.ts`	Aligns Babel package DTS generation to shared TS config.
`internal-packages/oxc-unshadowed-visitor/**`	Adds the internal scope-aware visitor package + tests + bench.
`internal-packages/swc-output-gen/**`	Adds an internal tool to generate `output.swc.js` for fixtures using SWC plugins.
`internal-packages/benchmark-utils/**`	Adds a seeded RNG utility for deterministic benchmark generation.
`examples/**`	Adds Playwright-backed E2E test harness + an Emotion example app.
`.oxlintrc.json`	Disables `no-shadow` and ignores fixtures/benchmarks for linting.
`.oxfmtrc.json`	Ignores fixtures directories in formatting.
`.gitignore`	Ignores `.swc`, temporary examples dirs, and generated SWC outputs.
`.github/workflows/ci.yml`	Installs Playwright Chromium in CI to support the new examples tests.
`.gitattributes`	Forces LF checkout to stabilize hash-based class name generation.
`package.json`	Adds `test:e2e` and `generate:swc-outputs` scripts.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

+export function getPos(source: string, offset: number): { line: number; column: number } {
+ let line = 0
+ let column = 0
+ for (let i = 0; i < offset && i < source.length; i++) {
+ if (source.charCodeAt(i) === LF) {
+ line++
+ column = 0
+ } else {
+ column++
+ }
+ }
+ return { line, column }


+import type { ESTree } from 'rolldown/utils'
+import { ExprKind } from './common'
+import type { ImportMapConfig } from './types'


sapphi-red · 2026-03-14T15:10:38Z

This PR adds @rolldown/plugin-emotion which utilizes Rolldown's native magic string feature.

In the synthetic benchmark included in this PR, this plugin is

1.30x faster than using @swc/plugin-emotion + @rollup/plugin-swc
2.64x faster than using @emotion/babel-plugin + @rolldown/plugin-babel

In a real world case, I tested with https://github.com/vanilla/vanilla/tree/release/2025.010 which I found in the GitHub search. Using this plugin was ~10% faster compared to Vite 8 +@swc/plugin-emotion + @rollup/plugin-swc.

The implementation is based on swc-project/plugins/packages/emotion (Apache License 2.0) and test cases are also adapted from it.

This PR also includes an internal package named oxc-unshadowed-visitor which make it easier to find varaibles that are imported.

…nternal package

Copilot

Pull request overview

This PR introduces a new @rolldown/plugin-emotion package that transforms Emotion css/styled usage using Rolldown’s native magic string support, and adds supporting infra (fixtures/benchmarks, an internal scope-aware visitor, and e2e examples) to validate behavior and measure performance.

Changes:

Added @rolldown/plugin-emotion implementation (imports tracking, label generation, sourcemap injection, CSS minification) plus extensive fixtures-based tests.
Added internal @rolldown/oxc-unshadowed-visitor package to detect unshadowed references in a single pass.
Expanded repo tooling/config to include internal packages, benchmarks, and Playwright-based examples in workspace + CI.

Reviewed changes

Copilot reviewed 183 out of 186 changed files in this pull request and generated 9 comments.

Show a summary per file

File	Description
`vitest.config.ts`	Expands Vitest projects to include internal packages, benchmarks, and examples.
`tsconfig.json`	Converts root TS config to a solution config referencing shared + examples configs.
`tsconfig.common.json`	Introduces shared TS compiler options for packages (excludes examples).
`pnpm-workspace.yaml`	Adds benchmarks, internal packages, and examples to the workspace.
`packages/emotion/vitest.config.ts`	Adds a dedicated Vitest project for the emotion package.
`packages/emotion/tsdown.config.ts`	Adds tsdown build config for the new plugin package.
`packages/emotion/src/index.ts`	Core plugin implementation: transforms `css`/`styled`/`Global` patterns, labels, targets, and sourcemaps.
`packages/emotion/src/types.ts`	Defines public plugin option types, including `importMap` and label formatting.
`packages/emotion/src/import-map.ts`	Maps imports/specifiers to Emotion expression kinds to decide what to transform.
`packages/emotion/src/label.ts`	Implements label sanitization and label template expansion.
`packages/emotion/src/source-map.ts`	Inline sourcemap generation + offset-to-line/column mapping.
`packages/emotion/src/css-minify.ts`	CSS template minification (comments/whitespace compaction).
`packages/emotion/src/css-minify.test.ts`	Unit tests for the CSS minifier.
`packages/emotion/tests/transform.test.ts`	Fixture runner that builds via Rolldown and snapshots outputs.
`packages/emotion/tests/fixtures/**`	Adds many fixture inputs/expected outputs for transform coverage.
`packages/emotion/tests/fixtures-labels/**`	Adds many label-focused fixtures/expected outputs.
`packages/emotion/package.json`	Declares the new published plugin package metadata and deps/peers.
`packages/emotion/README.md`	Documents usage, options, and benchmark results for the plugin.
`packages/emotion/LICENSE`	Adds a license file placeholder for the package.
`packages/emotion/benchmark/**`	Adds a benchmark package (generator, app, build configs, vitest bench).
`packages/babel/tsdown.config.ts`	Aligns Babel package DTS generation to shared TS config.
`internal-packages/oxc-unshadowed-visitor/**`	Adds the internal scope-aware visitor package + tests + bench.
`internal-packages/swc-output-gen/**`	Adds an internal tool to generate `output.swc.js` for fixtures using SWC plugins.
`internal-packages/benchmark-utils/**`	Adds a seeded RNG utility for deterministic benchmark generation.
`examples/**`	Adds Playwright-backed E2E test harness + an Emotion example app.
`.oxlintrc.json`	Disables `no-shadow` and ignores fixtures/benchmarks for linting.
`.oxfmtrc.json`	Ignores fixtures directories in formatting.
`.gitignore`	Ignores `.swc`, temporary examples dirs, and generated SWC outputs.
`.github/workflows/ci.yml`	Installs Playwright Chromium in CI to support the new examples tests.
`.gitattributes`	Forces LF checkout to stabilize hash-based class name generation.
`package.json`	Adds `test:e2e` and `generate:swc-outputs` scripts.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

+export function getPos(source: string, offset: number): { line: number; column: number } {
+ let line = 0
+ let column = 0
+ for (let i = 0; i < offset && i < source.length; i++) {
+ if (source.charCodeAt(i) === LF) {
+ line++
+ column = 0
+ } else {
+ column++
+ }
+ }
+ return { line, column }


+import type { ESTree } from 'rolldown/utils'
+import { ExprKind } from './common'
+import type { ImportMapConfig } from './types'


sapphi-red · 2026-03-14T15:10:38Z

This PR adds @rolldown/plugin-emotion which utilizes Rolldown's native magic string feature.

In the synthetic benchmark included in this PR, this plugin is

1.30x faster than using @swc/plugin-emotion + @rollup/plugin-swc
2.64x faster than using @emotion/babel-plugin + @rolldown/plugin-babel

In a real world case, I tested with https://github.com/vanilla/vanilla/tree/release/2025.010 which I found in the GitHub search. Using this plugin was ~10% faster compared to Vite 8 +@swc/plugin-emotion + @rollup/plugin-swc.

The implementation is based on swc-project/plugins/packages/emotion (Apache License 2.0) and test cases are also adapted from it.

This PR also includes an internal package named oxc-unshadowed-visitor which make it easier to find varaibles that are imported.

…nternal package

Copilot

Pull request overview

This PR introduces a new @rolldown/plugin-emotion package that transforms Emotion css/styled usage using Rolldown’s native magic string support, and adds supporting infra (fixtures/benchmarks, an internal scope-aware visitor, and e2e examples) to validate behavior and measure performance.

Changes:

Added @rolldown/plugin-emotion implementation (imports tracking, label generation, sourcemap injection, CSS minification) plus extensive fixtures-based tests.
Added internal @rolldown/oxc-unshadowed-visitor package to detect unshadowed references in a single pass.
Expanded repo tooling/config to include internal packages, benchmarks, and Playwright-based examples in workspace + CI.

Reviewed changes

Copilot reviewed 183 out of 186 changed files in this pull request and generated 9 comments.

Show a summary per file

File	Description
`vitest.config.ts`	Expands Vitest projects to include internal packages, benchmarks, and examples.
`tsconfig.json`	Converts root TS config to a solution config referencing shared + examples configs.
`tsconfig.common.json`	Introduces shared TS compiler options for packages (excludes examples).
`pnpm-workspace.yaml`	Adds benchmarks, internal packages, and examples to the workspace.
`packages/emotion/vitest.config.ts`	Adds a dedicated Vitest project for the emotion package.
`packages/emotion/tsdown.config.ts`	Adds tsdown build config for the new plugin package.
`packages/emotion/src/index.ts`	Core plugin implementation: transforms `css`/`styled`/`Global` patterns, labels, targets, and sourcemaps.
`packages/emotion/src/types.ts`	Defines public plugin option types, including `importMap` and label formatting.
`packages/emotion/src/import-map.ts`	Maps imports/specifiers to Emotion expression kinds to decide what to transform.
`packages/emotion/src/label.ts`	Implements label sanitization and label template expansion.
`packages/emotion/src/source-map.ts`	Inline sourcemap generation + offset-to-line/column mapping.
`packages/emotion/src/css-minify.ts`	CSS template minification (comments/whitespace compaction).
`packages/emotion/src/css-minify.test.ts`	Unit tests for the CSS minifier.
`packages/emotion/tests/transform.test.ts`	Fixture runner that builds via Rolldown and snapshots outputs.
`packages/emotion/tests/fixtures/**`	Adds many fixture inputs/expected outputs for transform coverage.
`packages/emotion/tests/fixtures-labels/**`	Adds many label-focused fixtures/expected outputs.
`packages/emotion/package.json`	Declares the new published plugin package metadata and deps/peers.
`packages/emotion/README.md`	Documents usage, options, and benchmark results for the plugin.
`packages/emotion/LICENSE`	Adds a license file placeholder for the package.
`packages/emotion/benchmark/**`	Adds a benchmark package (generator, app, build configs, vitest bench).
`packages/babel/tsdown.config.ts`	Aligns Babel package DTS generation to shared TS config.
`internal-packages/oxc-unshadowed-visitor/**`	Adds the internal scope-aware visitor package + tests + bench.
`internal-packages/swc-output-gen/**`	Adds an internal tool to generate `output.swc.js` for fixtures using SWC plugins.
`internal-packages/benchmark-utils/**`	Adds a seeded RNG utility for deterministic benchmark generation.
`examples/**`	Adds Playwright-backed E2E test harness + an Emotion example app.
`.oxlintrc.json`	Disables `no-shadow` and ignores fixtures/benchmarks for linting.
`.oxfmtrc.json`	Ignores fixtures directories in formatting.
`.gitignore`	Ignores `.swc`, temporary examples dirs, and generated SWC outputs.
`.github/workflows/ci.yml`	Installs Playwright Chromium in CI to support the new examples tests.
`.gitattributes`	Forces LF checkout to stabilize hash-based class name generation.
`package.json`	Adds `test:e2e` and `generate:swc-outputs` scripts.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

+export function getPos(source: string, offset: number): { line: number; column: number } {
+ let line = 0
+ let column = 0
+ for (let i = 0; i < offset && i < source.length; i++) {
+ if (source.charCodeAt(i) === LF) {
+ line++
+ column = 0
+ } else {
+ column++
+ }
+ }
+ return { line, column }


+import type { ESTree } from 'rolldown/utils'
+import { ExprKind } from './common'
+import type { ImportMapConfig } from './types'


feat(internal/oxc-unshadowed-visitor): add oxc-unshadowed-visitor i…
9826dd6
…nternal package

sapphi-red force-pushed the feat/emotion-plugin branch 5 times, most recently from da68136 to a5e84bdCompare March 15, 2026 05:31

sapphi-red requested a review from Copilot March 15, 2026 08:25

Copilotstarted reviewing on behalf of sapphi-red March 15, 2026 08:26 View session

CopilotAI reviewed Mar 15, 2026
View reviewed changes

sapphi-red force-pushed the feat/emotion-plugin branch 2 times, most recently from 144e157 to 49cf775Compare March 15, 2026 09:11

sapphi-red added 4 commits March 15, 2026 18:31

feat(emotion): add emotion plugin
65399a0

test(emotion): add e2e example
87e6239

chore(emotion): add benchmark
3cf08f8

chore: add swc output generation script
ebe7bcd

sapphi-red force-pushed the feat/emotion-plugin branch from 49cf775 to ebe7bcdCompare March 15, 2026 09:31

sapphi-red merged commit 5461836 into mainMar 15, 2026
9 checks passed

sapphi-red deleted the feat/emotion-plugin branch March 15, 2026 09:43

sapphi-red mentioned this pull request Mar 15, 2026
Improve getPos performance #20
Open
4 tasks