Next.js: styled-jsx-postcss with the plugin postcss-cssnext - when I nest, I get an error

[Nick-vr]

Trying out styled-jsx-postcss with the plugin postcss-cssnext - when I nest, I get an erro: node.parent.after is not a function

• [x] I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

The nested css should work

Current Behavior

When I save I get this error:

Error in /home/nick/dev/Projects/FreeAdvancedMarketing/pages/index.js?entry
Module build failed: TypeError: /home/nick/dev/Projects/FreeAdvancedMarketing/pages/index.js?entry: node.parent.after is not a function
at module.exports (/home/nick/dev/Projects/FreeAdvancedMarketing/node_modules/postcss-nesting/lib/transform-nesting-rule.js:18:29)
at walk (/home/nick/dev/Projects/FreeAdvancedMarketing/node_modules/postcss-nesting/index.js:25:3)
at walk (/home/nick/dev/Projects/FreeAdvancedMarketing/node_modules/postcss-nesting/index.js:33:4)
at walk (/home/nick/dev/Projects/FreeAdvancedMarketing/node_modules/postcss-nesting/index.js:33:4)
at LazyResult.run (/home/nick/dev/Projects/FreeAdvancedMarketing/node_modules/styled-jsx-postcss/node_modules/postcss/lib/lazy-result.es6:321:20)
at LazyResult.asyncTick (/home/nick/dev/Projects/FreeAdvancedMarketing/node_modules/styled-jsx-postcss/node_modules/postcss/lib/lazy-result.es6:248:32)
at LazyResult.asyncTick (/home/nick/dev/Projects/FreeAdvancedMarketing/node_modules/styled-jsx-postcss/node_modules/postcss/lib/lazy-result.es6:260:22)
at LazyResult.asyncTick (/home/nick/dev/Projects/FreeAdvancedMarketing/node_modules/styled-jsx-postcss/node_modules/postcss/lib/lazy-result.es6:260:22)
at LazyResult.asyncTick (/home/nick/dev/Projects/FreeAdvancedMarketing/node_modules/styled-jsx-postcss/node_modules/postcss/lib/lazy-result.es6:260:22)
at LazyResult.asyncTick (/home/nick/dev/Projects/FreeAdvancedMarketing/node_modules/styled-jsx-postcss/node_modules/postcss/lib/lazy-result.es6:260:22)

Steps to Reproduce (for bugs)

https://github.com/Nick-vr/FreeAdvancedMarketing

1. clone
2. yarn
3. yarn dev

Context

I am trying to nest css with styled-jsx-postcss -> cssnext

Your Environment

| Tech | Version |
|---------|---------|
| next | beta |
| node | v7.4.0 |
| OS | Linux Mint |
| browser | Chrome |
| etc | |

[nickdandakis]

Downgrading postcss-cssnext to 2.11.0 fixes this. Not sure why though.

[pruhstal]

Recently noticed this and arrived at the same conclusion as @nickdandakis did above.

[Nick-vr]

Yes that fixed it, thanks
Would be nice if they fix it tho

[timneutkens]

@Nick-vr can you file an issue on styled-jsx-postcss?