storybook for next.js webpack config

webpack.config.js

const path = require('path')
const getBaseWebpackConfig = require('next/dist/build/webpack-config').default
const generateBuildId = require('next/dist/build/generate-build-id').generateBuildId
const loadConfig = require('next/dist/next-server/server/config').default
const { PHASE_DEVELOPMENT_SERVER } = require('next/dist/next-server/lib/constants')
const shortId = require('shortid')

module.exports = async ({ config, mode }) => {
  const dir = path.resolve(__dirname, '..')
  const _config = loadConfig(PHASE_DEVELOPMENT_SERVER, dir)
  const buildId = await generateBuildId(shortId, shortId)
  const nextBaseWebpackConfig = await getBaseWebpackConfig(dir, {
    buildId,
    isServer: false,
    config: _config,
    entrypoints: {}
  })
  const { module: { rules }, resolveLoader, plugins } = nextBaseWebpackConfig
  config.resolveLoader = {...config.resolveLoader, ...resolveLoader}
  config.module.rules = rules
  config.plugins.push(...plugins)
  config.plugins = [...new Set(config.plugins)]
  return config;
};