Storybook: TypeError: _webpack2.default.optimize.OccurenceOrderPlugin is not a constructor

[vass-david]

We've recently updated npms in our project. Storybook is now complaining with this error:

> [email protected] start:storybook /Users/davidvass/Work/Showmax/website/react
> start-storybook -p 9001

/Users/davidvass/Work/Showmax/website/react/node_modules/@kadira/storybook/dist/server/config/webpack.config.js:34
  plugins: [new _webpack2.default.optimize.OccurenceOrderPlugin(), new _webpack2.default.HotModuleReplacementPlugin(), new _caseSensitivePathsWebpackPlugin2.default()],
            ^

TypeError: _webpack2.default.optimize.OccurenceOrderPlugin is not a constructor
    at Object.<anonymous> (/Users/davidvass/Work/Showmax/website/react/node_modules/@kadira/storybook/dist/server/config/webpack.config.js:34:13)
    at Module._compile (module.js:556:32)
    at Object.Module._extensions..js (module.js:565:10)
    at Module.load (module.js:473:32)
    at tryModuleLoad (module.js:432:12)
    at Function.Module._load (module.js:424:3)
    at Module.require (module.js:483:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/Users/davidvass/Work/Showmax/website/react/node_modules/@kadira/storybook/dist/server/middleware.js:55:17)
    at Module._compile (module.js:556:32)

The apparent solution should be this (https://github.com/webpack/webpack/issues/1964):

OccurenceOrderPlugin has been renamed to OccurrenceOrderPlugin.

I know that in your package.json there is webpack in version 1.13.1, but it would be nice to support version 2 as well.

I've tried to rename problematic plugin name and after renaming it works fine. I suggest using some condition there so it will be compatible with older versions of webpack as well the newest one. What do you think?

[arunoda]

What's the storybook version you are running. Try to use the latest which is: v2.3.0. I hope it has the fix for this.

[arunoda]

May be this seems like a bug. Let me try to fix this.

[vass-david]

I've updated to v2.3.0 and the problem is still present. I think the only two options here are a) upgrade webpack or b) put simple condition there (e.g. new (webpack.optimize.OccurenceOrderPlugin || webpack.optimize.OccurrenceOrderPlugin)())

[vass-david]

BTW If my suggested solution b) is OK for you, I can create a PR myself since it's just one line modification.