Adding aliases to Storybook's webpack config

main.js

const path = require("path");

module.exports = {
  stories: [
    // "../stories/**/*.stories.mdx",
    // "../**/**/*.stories.@(js|jsx|ts|tsx)",
    "../components/**/*.stories.tsx",
  ],
  addons: [
    "@storybook/addon-links",
    "@storybook/addon-essentials",
    "@storybook/preset-scss",
  ],
  webpackFinal: async (config) => {
    const alias = {
      config: path.resolve(__dirname, "../config"),
      utils: path.resolve(__dirname, "../utils"),
      store: path.resolve(__dirname, "../store"),
      constants: path.resolve(__dirname, "../constants"),
      components: path.resolve(__dirname, "../components"),
      containers: path.resolve(__dirname, "../containers"),
    };
    return {
      ...config,
      resolve: {
        ...config.resolve,
        alias: { ...config.resolve.alias, ...alias },
      },
    };
  },
};