Storybook: First Run Error - Module build failed: SyntaxError: Unexpected token (8:4)

[stolinski]

I followed the setup instructions exactly and received this on first run.

ERROR in ./.stories/index.js
Module build failed: SyntaxError: Unexpected token (8:4)

   6 | storiesOf('Welcome', module)
   7 |   .add('to Storybook', () => (
>  8 |     <Welcome showApp={linkTo('Button')}/>
     |     ^
   9 |   ));
  10 |
  11 | storiesOf('Button', module)

 @ ./.storybook/config.js 4:2-24

[stolinski]

Had to change my babelrc to look like this.

{
  "presets": ["es2015", "es2016", "stage-0", "react"],
  "plugins": [
    "transform-object-rest-spread",
    "transform-decorators-legacy",
    "transform-class-properties",
    "babel-root-slash-import"
  ]
}

This should really be in the docs

[andyford]

I also ran into this issue while using storybook with create-react-app and styled-components. Based on @stolinski's babelrc comment, what worked for me was changing my babelrc from:

{
    "plugins": [
        "babel-plugin-styled-components",
    ]
}

to

{
    "presets": [
        "react"
    ],
    "plugins": [
        "babel-plugin-styled-components",
    ]
}