Migrating to v1 (rc)

Import Changes

In order to help folks not using React avoid extra bytes. The styled component helper has moved to it's own import: astroturf/react, which re-exports everything from astroturf as well as styled. To migrate automatically run the codemod:

npm install -g @codemod/cli
codemod --plugin astroturf/codemods/rename-styled-import [your files]

css to stylesheet

In v1 the css tag will now produce a single css class instead of a stylesheet. The old behavior is still useful, so a new tag stylesheet has been added that functions exactly the same way as the css tag pre version 1.

There is a codemod that will convert any non-css prop usages to stylesheet.

codemod --plugin astroturf/codemods/convert-css-to-stylesheet [your files]

New Option names and defaults

The astroturf options have been changed to be clearer and with better defaults.

• allowGlobal is now false by default
• tagName -> cssTagName
• styledTag -> styledTagName
• added stylesheetTagName

Extracted styles are imported with es module syntax

To be in a better place for tooling and optimizations astroturf now compiles style imports to import ... from instead of the CommonJs require. This fixes a few CSS ordering issues as well. There is no migratin step needed, but we recommend you also enable esmodules option on css-loader as well as mini-extract-css-plugin for webpack.