DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
(node:3244) DeprecationWarning: Tapable.apply is deprecated. Call apply on the plugin directly instead

$ npm run storybook

> xxx@1.0.0 storybook /Users/silicakes/dev/xxx
> start-storybook -p 6006

info @storybook/react v3.3.15
info
info => Loading custom webpack config (full-control mode).
/Users/silicakes/dev/xxx/node_modules/webpack/lib/DefinePlugin.js:42
                compiler.hooks.compilation.tap(
                              ^

TypeError: Cannot read property 'compilation' of undefined
    at DefinePlugin.apply (/Users/silicakes/dev/xxx/node_modules/webpack/lib/DefinePlugin.js:42:17)
    at Compiler.apply (/Users/silicakes/dev/xxx/node_modules/@storybook/react/node_modules/tapable/lib/Tapable.js:375:16)
    at webpack (/Users/silicakes/dev/xxx/node_modules/@storybook/react/node_modules/webpack/lib/webpack.js:33:19)
    at exports.default (/Users/silicakes/dev/xxx/node_modules/@storybook/react/dist/server/middleware.js:29:40)
    at Object.<anonymous> (/Users/silicakes/dev/xxx/node_modules/@storybook/react/dist/server/index.js:153:34)
    at Module._compile (module.js:573:30)
    at Object.Module._extensions..js (module.js:584:10)
    at Module.load (module.js:507:32)
    at tryModuleLoad (module.js:470:12)
    at Function.Module._load (module.js:462:3)
    at Module.require (module.js:517:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/silicakes/dev/xxx/node_modules/@storybook/react/bin/index.js:3:1)
    at Module._compile (module.js:573:30)
    at Object.Module._extensions..js (module.js:584:10)
    at Module.load (module.js:507:32)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! xxx@1.0.0 storybook: `start-storybook -p 6006`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the xxx@1.0.0 storybook script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/silicakes/.npm/_logs/2018-03-29T16_06_16_648Z-debug.log

import { configure } from '@storybook/react';

// automatically import all files ending in *.stories.js
const req = require.context('../stories', true, /.stories.tsx?$/);
function loadStories() {
  req.keys().forEach((filename) => req(filename));
}

const genDefaultConfig = require('@storybook/react/dist/server/config/defaults/webpack.config.js');
module.exports = (baseConfig, env) => {
  const config = genDefaultConfig(baseConfig, env);
  config.module.rules.push({
    test: /\.(ts|tsx)$/,
    loader: require.resolve('ts-loader')
  });
  config.resolve.extensions.push('.ts', '.tsx');
  return config;
};

const path = require('path');

module.exports = {
    entry: './src/index.tsx',
    mode: "development",
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, 'dist')
    },
    module: {
        rules: [{
            test: /\.tsx?$/,
            loader: "ts-loader"
        }],
    }
};

{
  "dependencies": {
    "react": "^16.2.0",
    "react-dom": "^16.2.0"
  },
  "devDependencies": {
    "@storybook/addon-actions": "^3.3.15",
    "@storybook/addon-links": "^3.3.15",
    "@storybook/addons": "^3.3.15",
    "@storybook/react": "^3.3.15",
    "@types/react": "^16.1.0",
    "@types/react-dom": "^16.0.4",
    "@types/storybook__react": "^3.0.7",
    "babel-core": "^6.26.0",
    "ts-loader": "^4.1.0",
    "typescript": "^2.8.1",
    "webpack": "^4.3.0",
    "webpack-cli": "^2.0.13",
    "webpack-dev-server": "^3.1.1"
  }
}