Support require() calls

[zapkub]

Plugin will not work properly with Typescript

from https://github.com/styled-components/styled-components/issues/1168#issuecomment-335465598 (Include workaround)

import default in Babel and Typescript have a little different. The result of Typescript come with .default

Reproduce

1. Clone this repo https://github.com/zapkub/nextjs-typescript-styled-component
2. Modify index.tsx line 2 from StyledComponents to styled and remove line no. 3
3. Run project
4. Plugin will be broken

Detail

babel-plugin-styled-components@1.2.1 styled-component@2.2.1 next@4.0.1

[herrkris]

I did some digging and I think the problem is that in importLocalName function the imports array is empty, because TypeScript already compiles the imports to require calls.

You can modify the tconfig.json to workaround that problem and let babel to the transpiling of the imports. I forked your repo and commited the changes if you want to take a look. It's still a workaround, but I guess it's nicer than having const styled = styledComponents in your files.

[zapkub]

@herrkris Yes !! the problem is solve after I change module config ( from commonjs to es2015 )

but another problem is I use babel only on client script so it broke my node.

so I need to setup my babel in server side too for this workaround

[mxstbr]

Yeah, we should handle requires too!

[mxstbr]

I've updated the issue title and labels, a PR that implements require support would be much appreciated!