Anber / wyw-in-js

MIT License
228 stars 16 forks source link

CSS not generated in `var a = function a() { ... }` #83

Open yume-chan opened 4 months ago

yume-chan commented 4 months ago

Environment

Description

This is a repost of https://github.com/callstack/linaria/issues/1312

For this code:

import {css} from '@linaria/atomic'

export const a = function a() {
    return css`
        background-color: red;
    `
}

css template string in a() will be replaced with names, but the CSS rules won't be generated.

https://github.com/Anber/wyw-in-js/blob/9a3a33d3928e03660d0b5f97f0e0e8521e36ff69/packages/transform/src/utils/getTagProcessor.ts#L371-L383

parent is the const a node, but path.scope.getBinding(id.node.name) returns the function a() node. function a() node has no references so CSS extraction was skipped.

This code is simplified from an output of Solid.js babel plugin, so it can't change.

Reproducible Demo

https://github.com/yume-chan/wyw-css-issue

style.js exports two functions a and b, both of them generates CSS styles using wyw-in-js. main.js applies both classes to <h1>, but only b is effective.