Support for keeping CSS in separate files

[ythecombinator]

Is this feature currently supported?

I have the following in my styles.js:

const styles = `

@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro');
@import url(//fonts.googleapis.com/css?family=Fira+Sans:300);

html, body {
  margin: 0;
  padding: 0; }

...

`
export default styles

And when I try to import it in my component via

import styles from './styles'
...
    <style jsx>
      { styles }
    </style>

I end up getting the following error:

Syntax Error: <style jsx>{`some css`}</style>), but got Identifier

My guess would be that it probably happens because external StyleSheets support came after this package's last update–which still sounds strange since you authored the PR on styled-jsx 😄 .

Any ideas on what's happening?

[giuseppeg]

yep this packages is using 0.5.7 so unfortunately external styles are not supported.