/* eslint-disable no-param-reassign */
import VueLoaderPlugin from 'vue-loader/lib/plugin';
import type { Configuration } from 'webpack';

export function webpack(config: Configuration) {
  config.plugins.push(new VueLoaderPlugin());
  config.module.rules.push({
    test: /\.vue$/,
    loader: require.resolve('vue-loader'),
    options: {},
  });
  config.module.rules.push({
    test: /\.tsx?$/,
    use: [
      {
        loader: require.resolve('ts-loader'),
        options: {
          transpileOnly: true,
          appendTsSuffixTo: [/\.vue$/],
        },
      },
    ],
  });

  config.resolve.extensions.push('.vue');
  config.resolve.alias = { ...config.resolve.alias, vue$: require.resolve('vue/dist/vue.esm.js') };

  return config;
}

/* eslint-disable no-param-reassign */
import VueLoaderPlugin from 'vue-loader/lib/plugin';
import type { Configuration } from 'webpack';

import type { Options, TypescriptConfig } from '@storybook/core-common';

export async function webpack(config: Configuration, { presets }: Options) {
  const typescriptOptions = await presets.apply<TypescriptConfig>('typescript', {} as any);

  config.plugins.push(new VueLoaderPlugin());
  config.module.rules.push({
    test: /\.vue$/,
    loader: require.resolve('vue-loader'),
    options: {},
  });
  config.module.rules.push({
    test: /\.tsx?$/,
    use: [
      {
        loader: require.resolve('ts-loader'),
        options: {
          transpileOnly: !typescriptOptions.check,
          appendTsSuffixTo: [/\.vue$/],
        },
      },
    ],
  });

  config.resolve.extensions.push('.vue');
  config.resolve.alias = { ...config.resolve.alias, vue$: require.resolve('vue/dist/vue.esm.js') };

  return config;
}

Check types when `typescript.check` is true
fix(vue): Check types when `typescript.check` is true

https://github.com/storybookjs/storybook/issues/14987

TypeScript checks in `@storybook/vue` has not been enabled. This commit
enables users to turn on type checking process powered by ts-loader.

From performance perspective, fork-ts-checker-webpack-plugin is better
especially for large projects. However, it needs one of 1) modifying
type-checker options in each builders or 2) adding
fork-ts-checker-webpack-plugin as a dependency of `@storybook/vue`.
I think both comes with huge downsides and it should be done in user
side by setting `typescript.check: false` and configuring the plugin
manually.
