🇺🇦 STOP WAR IN UKRAINE 🇺🇦
Emotion
  • Docs
  • Community
  • GitHub
  • Slack
  • Spectrum
  • v10 Docs

Getting Started

  • Introduction
  • Install
  • The css Prop
  • Styled Components
  • Composition
  • Object Styles
  • Nested Selectors
  • Media Queries
  • Global Styles
  • Package Summaries

Advanced

  • Keyframes
  • Server Side Rendering
  • Attaching Props
  • Theming
  • Labels
  • Class Names
  • CacheProvider

Tooling

  • Babel Plugin
  • Babel Macros
  • Source Maps
  • Snapshot Testing
  • TypeScript
  • Flow

Packages

  • @emotion/react
  • @emotion/styled
  • @emotion/cache
  • @emotion/css
  • @emotion/babel-plugin
  • @emotion/eslint-plugin
  • @emotion/server
  • @emotion/jest
  • @emotion/native
  • @emotion/primitives
  • @emotion/babel-preset-css-prop

Posts

  • Emotion 11
  • Migrating to Emotion 10

Source Maps

✏️ Edit this page

Note:

@emotion/babel-plugin is required for source maps

Emotion supports source maps for styles authored in JavaScript.

source-map-demo

Required For Source Maps:

  1. @emotion/babel-plugin must be in your Babel setup. [documentation]
  2. process.env.NODE_ENV must be any value except "production"

Note:

Source maps are on by default in @emotion/babel-plugin but they will be removed in production builds