babel-plugin-styled-components: Next.js app stuck on "compiling" with version >= 1.10.3
Our Next.js app is https://github.com/opencollective/opencollective-frontend/
When upgrading to a version >= 1.10.3
of babel-plugin-styled-components
, our dev environment is unusable, the app is stuck on “compiling …”.
We had to downgrade to version 1.10.2
:
https://github.com/opencollective/opencollective-frontend/pull/2044
To reproduce:
git clone git@github.com:opencollective/opencollective-frontend.git
cd opencollective-frontend
npm install
npm install babel-plugin-styled-components@1.10.3 --save-exact
npm run dev
- Go to:
http://localhost:3000/
Current behavior:
- app is stuck on “compiling …”
- can’t load any page.
Expected behavior:
- app succeeds compiling
- can load any page
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Comments: 19 (2 by maintainers)
Commits related to this issue
- Fix `importName` type confusion (string, bool, node) Apparently `importName` can have many different types: https://github.com/styled-components/babel-plugin-styled-components/issues/232#issuecomment... — committed to ZauberNerd/babel-plugin-styled-components by ZauberNerd 5 years ago
- Fix `importName` type confusion (string, bool, node) Apparently `importName` can have many different types: https://github.com/styled-components/babel-plugin-styled-components/issues/232#issuecomment... — committed to ZauberNerd/babel-plugin-styled-components by ZauberNerd 5 years ago
- Fix `importName` type confusion (string, bool, node) Apparently `importName` can have many different types: https://github.com/styled-components/babel-plugin-styled-components/issues/232#issuecomment... — committed to ZauberNerd/babel-plugin-styled-components by ZauberNerd 5 years ago
- Fix `importName` type confusion (string, bool, node) (#233) Apparently `importName` can have many different types: https://github.com/styled-components/babel-plugin-styled-components/issues/232#issu... — committed to styled-components/babel-plugin-styled-components by ZauberNerd 5 years ago
- Fix early return for cached `false` values in `importLocalName` Closes: #232 — committed to ZauberNerd/babel-plugin-styled-components by ZauberNerd 5 years ago
- Fix early return for cached `false` values in `importLocalName` (#234) Closes: #232 — committed to styled-components/babel-plugin-styled-components by ZauberNerd 5 years ago
Oh, oh, shame on me. I missed the babel cache in
./node_module/.cache/
… 😦 I’m looking into it…Edit:: So, it looks like
importLocalName
returnsfalse
for all calls in this file: https://github.com/styled-components/babel-plugin-styled-components/blob/master/src/utils/detectors.js#L69 and https://github.com/styled-components/babel-plugin-styled-components/blob/master/src/utils/detectors.js#L93-L104@znarf @probablyup ~this change causes our builds to get stuck: https://github.com/styled-components/babel-plugin-styled-components/pull/230/files#diff-09a7c7a1456b228d86909e9c7f46ec3f When I revert just that one line, everything works as it was before.~
Edit: Ah, I found it: Here we try to access
importName.name
: https://github.com/styled-components/babel-plugin-styled-components/pull/230/files#diff-6834cbe885e4faffa7e63e5846c6a8eeR32 But only a few lines later, we make sure, thatimportName
is actually an identifier: https://github.com/styled-components/babel-plugin-styled-components/pull/230/files#diff-6834cbe885e4faffa7e63e5846c6a8eeR40Also: With this new change, the variable
importName
can now be: astring
orfalse
or a@babel/types
node
(apparently either at.identifier
, at.memberExpression
ort.sequenceExpression
?) which feels overly complex…I tested
1.10.6
and it’s fixing the original issue.