From e7e51b0c3e8e84f6fd92a8debcc5c6cfd6b12827 Mon Sep 17 00:00:00 2001
From: kyletsang <6854874+kyletsang@users.noreply.github.com>
Date: Fri, 28 Apr 2023 23:37:09 -0700
Subject: [PATCH] Build: Migrate @storybook/preset-vue-webpack to strict TS

---
 .../src/framework-preset-vue-docs.ts          |  4 ++--
 .../vue-webpack/src/framework-preset-vue.ts   | 24 ++++++++++---------
 code/presets/vue-webpack/tsconfig.json        |  2 +-
 3 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/code/presets/vue-webpack/src/framework-preset-vue-docs.ts b/code/presets/vue-webpack/src/framework-preset-vue-docs.ts
index 1d1f6d54161..bd4dc600add 100644
--- a/code/presets/vue-webpack/src/framework-preset-vue-docs.ts
+++ b/code/presets/vue-webpack/src/framework-preset-vue-docs.ts
@@ -16,7 +16,7 @@ export const webpackFinal: StorybookConfig['webpackFinal'] = (config, options) =
     }
   });
 
-  config.module.rules.push({
+  config.module?.rules?.push({
     test: /\.vue$/,
     loader: require.resolve('vue-docgen-loader', {
       paths: [require.resolve('@storybook/preset-vue-webpack')],
@@ -24,7 +24,7 @@ export const webpackFinal: StorybookConfig['webpackFinal'] = (config, options) =
     enforce: 'post',
     options: {
       docgenOptions: {
-        alias: config.resolve.alias,
+        alias: config.resolve?.alias,
         ...vueDocgenOptions,
       },
     },
diff --git a/code/presets/vue-webpack/src/framework-preset-vue.ts b/code/presets/vue-webpack/src/framework-preset-vue.ts
index 21e035db663..4546bb359e4 100644
--- a/code/presets/vue-webpack/src/framework-preset-vue.ts
+++ b/code/presets/vue-webpack/src/framework-preset-vue.ts
@@ -4,30 +4,27 @@ import { VueLoaderPlugin } from 'vue-loader';
 import type { StorybookConfig } from '@storybook/core-webpack';
 
 export const webpack: StorybookConfig['webpack'] = async (config, { presets }) => {
-  const typescriptOptions = await presets.apply<StorybookConfig['typescript']>(
-    'typescript',
-    {} as any
-  );
+  const typescriptOptions = await presets.apply<StorybookConfig['typescript']>('typescript', {});
 
-  config.plugins.push(new VueLoaderPlugin());
-  config.module.rules.push({
+  config.plugins?.push(new VueLoaderPlugin());
+  config.module?.rules?.push({
     test: /\.vue$/,
     loader: require.resolve('vue-loader'),
     options: {},
   });
-  config.module.rules.push({
+  config.module?.rules?.push({
     test: /\.ts$/,
     use: [
       {
         loader: require.resolve('ts-loader'),
         options: {
-          transpileOnly: !typescriptOptions.check,
+          transpileOnly: !typescriptOptions?.check,
           appendTsSuffixTo: [/\.vue$/],
         },
       },
     ],
   });
-  config.module.rules.push({
+  config.module?.rules?.push({
     test: /\.tsx$/,
     use: [
       {
@@ -40,8 +37,13 @@ export const webpack: StorybookConfig['webpack'] = async (config, { presets }) =
     ],
   });
 
-  config.resolve.extensions.push('.vue');
-  config.resolve.alias = { ...config.resolve.alias, vue$: require.resolve('vue/dist/vue.esm.js') };
+  if (config.resolve) {
+    config.resolve.extensions?.push('.vue');
+    config.resolve.alias = {
+      ...config.resolve.alias,
+      vue$: require.resolve('vue/dist/vue.esm.js'),
+    };
+  }
 
   return config;
 };
diff --git a/code/presets/vue-webpack/tsconfig.json b/code/presets/vue-webpack/tsconfig.json
index 341feacbe22..55e078e431f 100644
--- a/code/presets/vue-webpack/tsconfig.json
+++ b/code/presets/vue-webpack/tsconfig.json
@@ -3,7 +3,7 @@
   "compilerOptions": {
     "skipLibCheck": true,
     "resolveJsonModule": true,
-    "strict": false
+    "strict": true
   },
   "include": ["src/**/*"]
 }