Module parse failed for spread operator and jsx

Hi, upon running plugin, I am getting errors pointing to spread operators and jsx

node: v8.9.0
npm: 5.5.1

Also, custom babel and webpack configs are used. Any hints on why this could be happening?

ERROR

ERROR in ./node_modules/storybook-chrome-screenshot/src/with-screenshot.js
Module parse failed: Unexpected token (14:6)
You may need an appropriate loader to handle this file type.
|   const wrapperWithContext = (context) => {
|     const props = {
|       ...mergeScreenshotOptions(options),
|       channel,
|       context,
 @ ./node_modules/storybook-chrome-screenshot/src/index.js 2:0-62
 @ ./.storybook/config.js
 @ multi ./node_modules/@storybook/react/dist/server/config/polyfills.js ./node_modules/@storybook/react/dist/server/config/globals.js (webpack)-hot-middleware/client.js?reload=true ./.storybook/config.js

ERROR in ./node_modules/storybook-chrome-screenshot/src/screenshot-options.js
Module parse failed: Unexpected token (19:6)
You may need an appropriate loader to handle this file type.
|
|     viewport = options.viewport.map(vp => ({
|       ...baseViewport,
|       ...vp,
|     }));
 @ ./node_modules/storybook-chrome-screenshot/src/index.js 1:0-82
 @ ./.storybook/config.js
 @ multi ./node_modules/@storybook/react/dist/server/config/polyfills.js ./node_modules/@storybook/react/dist/server/config/globals.js (webpack)-hot-middleware/client.js?reload=true ./.storybook/config.js

ERROR in ./node_modules/storybook-chrome-screenshot/src/init-screenshot.js
Module parse failed: Unexpected token (8:10)
You may need an appropriate loader to handle this file type.
|   const channel = addons.getChannel();
|
|   return (<InitScreenshotWrapper channel={channel} context={ctx}>
|     { storyFn() }
|   </InitScreenshotWrapper>);
 @ ./node_modules/storybook-chrome-screenshot/src/index.js 3:0-62
 @ ./.storybook/config.js
 @ multi ./node_modules/@storybook/react/dist/server/config/polyfills.js ./node_modules/@storybook/react/dist/server/config/globals.js (webpack)-hot-middleware/client.js?reload=true ./.storybook/config.js

.babelrc

{
  "presets": [[
    "env", { "targets": { "browsers": ["last 2 versions"] } }],
    "react",
    "stage-2"
  ],
  "plugins": ["transform-decorators-legacy", "transform-class-properties"]
}

webpack.config.js

const path = require('path');

module.exports = {
  module: {
    rules: [
      {
        test: /\.(css|scss)$/,
        use: [
          "style-loader",
          {
            loader: "css-loader",
            options: { sourceMap: true }
          },
          {
            loader: "sass-loader",
            options: { sourceMap: true }
          }
        ]
      },
      {
        test: /\.svg$/,
        use: {
          loader: "svg-url-loader",
          options: { limit: 8192 }
        }
      },
      {
        test: /\.(png|jpg|gif)$/,
        use: {
          loader: "url-loader",
          options: { limit: 8192 }
        }
      },
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader",
          options: {
            presets: ["env", "react", "stage-2"],
            plugins: ["transform-decorators-legacy", "transform-class-properties"]
          }
        }
      },
    ],
  },
  resolve: {
    extensions: ['.js', '.jsx'],
  },
};

[camsloanftc]

I am repeating this from my comment in #12.

Temporary workaround… anytime I was calling the storybook-chrome-screenshot module in my code I had to reference the /lib folder.

So in .storybook/addons.js: import 'storybook-chrome-screenshot/lib/register'

in .storybook/config.js: import { setScreenshotOptions } from 'storybook-chrome-screenshot/lib'

and then same with anywhere else you use it (such as individual stories).

[camsloanftc]

This is the same error I received then updating to 0.7.0. Seems to have been caused by #12, so I left a comment there about it. I am not sure why only some of us are experiencing this issue though.