search

styled-components / styled-components

Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅
https://styled-components.com
MIT License
40.44k stars 2.49k forks source link

Exported variable with `css` function, returns `['null']`. Wrong template literal parsing #3600

Open ghost opened 3 years ago

ghost commented 3 years ago

Environment

styled-components: 5.3.1 babel-plugin-styled-components: 1.13.2 typescript: 3.9.5 @babel/core: 7.15.8 @babel/preset-typescript: 7.15.0

Reproduction

common.ts:

export const common = css`
  *,
  *:before,
  *:after {
    box-sizing: border-box;
  }`

global.ts:

import { common } from './common.ts'
console.log(common) -> here consoling as ['null']

Steps to reproduce

Expected Behavior

exported css function should return an array of correct CSS and interpolations

Actual Behavior

returning ['null']

Lonli-Lokli commented 2 years ago

Is there any workaround? Cannot use interpolation for after pseudo element from props