ci(editor): Start optionally type-checking frontend code during build (no-changelog) (#8787)

package.json

@@ -69,6 +69,7 @@
     "turbo": "1.10.12",
     "typescript": "*",
     "vite": "^5.0.12",
+    "vite-plugin-checker": "^0.6.4",
     "vitest": "^1.2.1",
     "vue-tsc": "^1.8.27"
   },

packages/@n8n/chat/vite.config.ts

@@ -1,6 +1,7 @@
 import { fileURLToPath, URL } from 'node:url';
 
 import { defineConfig } from 'vite';
+import checker from 'vite-plugin-checker';
 import { resolve } from 'path';
 import vue from '@vitejs/plugin-vue';
 import icons from 'unplugin-icons/vite';
@@ -9,15 +10,20 @@ import dts from 'vite-plugin-dts';
 const includeVue = process.env.INCLUDE_VUE === 'true';
 const srcPath = fileURLToPath(new URL('./src', import.meta.url));
 
+const plugins = [
+	vue(),
+	icons({
+		compiler: 'vue3',
+	}),
+	dts(),
+];
+if (process.env.ENABLE_TYPE_CHECKING === 'true') {
+	plugins.push(checker({ vueTsc: true }));
+}
+
 // https://vitejs.dev/config/
 export default defineConfig({
-	plugins: [
-		vue(),
-		icons({
-			compiler: 'vue3',
-		}),
-		dts(),
-	],
+	plugins,
 	resolve: {
 		alias: {
 			'@': srcPath,

packages/design-system/vite.config.mts

@@ -1,6 +1,7 @@
 import vue from '@vitejs/plugin-vue';
 import { resolve } from 'path';
 import { defineConfig, mergeConfig } from 'vite';
+import checker from 'vite-plugin-checker';
 import { type UserConfig } from 'vitest';
 import { defineConfig as defineVitestConfig } from 'vitest/config';
 
@@ -28,9 +29,14 @@ export const vitestConfig = defineVitestConfig({
 	},
 }) as UserConfig;
 
+const plugins = [vue()];
+if (process.env.ENABLE_TYPE_CHECKING === 'true') {
+	plugins.push(checker({ vueTsc: true }));
+}
+
 export default mergeConfig(
 	defineConfig({
-		plugins: [vue()],
+		plugins,
 		resolve: {
 			alias: {
 				'@': resolve(__dirname, 'src'),

packages/editor-ui/vite.config.mts

@@ -2,6 +2,7 @@ import vue from '@vitejs/plugin-vue';
 import { resolve } from 'path';
 import { defineConfig, mergeConfig } from 'vite';
 import { sentryVitePlugin } from '@sentry/vite-plugin';
+import checker from 'vite-plugin-checker';
 
 import packageJSON from './package.json';
 import { vitestConfig } from '../design-system/vite.config.mts';
@@ -73,8 +74,11 @@ const plugins = [
 	icons({
 		compiler: 'vue3',
 	}),
-	vue()
+	vue(),
 ];
+if (process.env.ENABLE_TYPE_CHECKING === 'true') {
+	plugins.push(checker({ vueTsc: true }));
+}
 
 const { SENTRY_AUTH_TOKEN: authToken, RELEASE: release } = process.env;
 if (release && authToken) {

pnpm-lock.yaml

@@ -130,6 +130,9 @@ importers:
       vite:
         specifier: ^5.0.12
         version: 5.0.12(sass@1.64.1)
+      vite-plugin-checker:
+        specifier: ^0.6.4
+        version: 0.6.4(typescript@5.3.2)(vite@5.0.12)(vue-tsc@1.8.27)
       vitest:
         specifier: ^1.2.1
         version: 1.2.1
@@ -2848,7 +2851,6 @@ packages:
       '@babel/highlight': 7.23.4
       chalk: 2.4.2
     dev: true
-    optional: true
 
   /@babel/compat-data@7.22.9:
     resolution: {integrity: sha512-5UamI7xkUcJ3i9qVDS+KFDEK8/7oJ55/sJMB1Ge7IEapr7KfdfV/HErR+koZwOfd+SgtFKOKRhRakdg++DcJpQ==}
@@ -3121,7 +3123,6 @@ packages:
       chalk: 2.4.2
       js-tokens: 4.0.0
     dev: true
-    optional: true
 
   /@babel/parser@7.22.7:
     resolution: {integrity: sha512-7NF8pOkHP5o2vpmGgNGcfAeCvOYhGLyA3Z4eBQkT1RJlWu47n63bCs93QfJ2hIAFCil7L5P2IWhs1oToVgrL0Q==}
@@ -12836,6 +12837,11 @@ packages:
     engines: {node: '>= 10'}
     dev: true
 
+  /commander@8.3.0:
+    resolution: {integrity: sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==}
+    engines: {node: '>= 12'}
+    dev: true
+
   /commander@9.4.1:
     resolution: {integrity: sha512-5EEkTNyHNGFPD2H+c/dXXfQZYa/scCKasxWcXJaWnNJ99pnQN9Vnmqow+p+PlFPE63Q6mThaZws1T+HxfpgtPw==}
     engines: {node: ^12.20.0 || >=14}
@@ -25636,6 +25642,57 @@ packages:
       - terser
     dev: true
 
+  /vite-plugin-checker@0.6.4(typescript@5.3.2)(vite@5.0.12)(vue-tsc@1.8.27):
+    resolution: {integrity: sha512-2zKHH5oxr+ye43nReRbC2fny1nyARwhxdm0uNYp/ERy4YvU9iZpNOsueoi/luXw5gnpqRSvjcEPxXbS153O2wA==}
+    engines: {node: '>=14.16'}
+    peerDependencies:
+      eslint: '>=7'
+      meow: ^9.0.0
+      optionator: ^0.9.1
+      stylelint: '>=13'
+      typescript: ^5.3.0
+      vite: '>=2.0.0'
+      vls: '*'
+      vti: '*'
+      vue-tsc: '>=1.3.9'
+    peerDependenciesMeta:
+      eslint:
+        optional: true
+      meow:
+        optional: true
+      optionator:
+        optional: true
+      stylelint:
+        optional: true
+      typescript:
+        optional: true
+      vls:
+        optional: true
+      vti:
+        optional: true
+      vue-tsc:
+        optional: true
+    dependencies:
+      '@babel/code-frame': 7.23.5
+      ansi-escapes: 4.3.2
+      chalk: 4.1.2
+      chokidar: 3.5.2
+      commander: 8.3.0
+      fast-glob: 3.2.12
+      fs-extra: 11.1.1
+      npm-run-path: 4.0.1
+      semver: 7.5.4
+      strip-ansi: 6.0.1
+      tiny-invariant: 1.3.1
+      typescript: 5.3.2
+      vite: 5.0.12(sass@1.64.1)
+      vscode-languageclient: 7.0.0
+      vscode-languageserver: 7.0.0
+      vscode-languageserver-textdocument: 1.0.11
+      vscode-uri: 3.0.8
+      vue-tsc: 1.8.27(typescript@5.3.2)
+    dev: true
+
   /vite-plugin-dts@3.6.4(rollup@3.29.4)(typescript@5.3.2)(vite@5.0.12):
     resolution: {integrity: sha512-yOVhUI/kQhtS6lCXRYYLv2UUf9bftcwQK9ROxCX2ul17poLQs02ctWX7+vXB8GPRzH8VCK3jebEFtPqqijXx6w==}
     engines: {node: ^14.18.0 || >=16.0.0}
@@ -25757,6 +25814,46 @@ packages:
     engines: {node: '>=0.10.0'}
     dev: true
 
+  /vscode-jsonrpc@6.0.0:
+    resolution: {integrity: sha512-wnJA4BnEjOSyFMvjZdpiOwhSq9uDoK8e/kpRJDTaMYzwlkrhG1fwDIZI94CLsLzlCK5cIbMMtFlJlfR57Lavmg==}
+    engines: {node: '>=8.0.0 || >=10.0.0'}
+    dev: true
+
+  /vscode-languageclient@7.0.0:
+    resolution: {integrity: sha512-P9AXdAPlsCgslpP9pRxYPqkNYV7Xq8300/aZDpO35j1fJm/ncize8iGswzYlcvFw5DQUx4eVk+KvfXdL0rehNg==}
+    engines: {vscode: ^1.52.0}
+    dependencies:
+      minimatch: 3.1.2
+      semver: 7.5.4
+      vscode-languageserver-protocol: 3.16.0
+    dev: true
+
+  /vscode-languageserver-protocol@3.16.0:
+    resolution: {integrity: sha512-sdeUoAawceQdgIfTI+sdcwkiK2KU+2cbEYA0agzM2uqaUy2UpnnGHtWTHVEtS0ES4zHU0eMFRGN+oQgDxlD66A==}
+    dependencies:
+      vscode-jsonrpc: 6.0.0
+      vscode-languageserver-types: 3.16.0
+    dev: true
+
+  /vscode-languageserver-textdocument@1.0.11:
+    resolution: {integrity: sha512-X+8T3GoiwTVlJbicx/sIAF+yuJAqz8VvwJyoMVhwEMoEKE/fkDmrqUgDMyBECcM2A2frVZIUj5HI/ErRXCfOeA==}
+    dev: true
+
+  /vscode-languageserver-types@3.16.0:
+    resolution: {integrity: sha512-k8luDIWJWyenLc5ToFQQMaSrqCHiLwyKPHKPQZ5zz21vM+vIVUSvsRpcbiECH4WR88K2XZqc4ScRcZ7nk/jbeA==}
+    dev: true
+
+  /vscode-languageserver@7.0.0:
+    resolution: {integrity: sha512-60HTx5ID+fLRcgdHfmz0LDZAXYEV68fzwG0JWwEPBode9NuMYTIxuYXPg4ngO8i8+Ou0lM7y6GzaYWbiDL0drw==}
+    hasBin: true
+    dependencies:
+      vscode-languageserver-protocol: 3.16.0
+    dev: true
+
+  /vscode-uri@3.0.8:
+    resolution: {integrity: sha512-AyFQ0EVmsOZOlAnxoFOGOq1SQDWAB7C6aqMGS23svWAllfOaxbuFvcT8D1i8z3Gyn8fraVeZNNmN6e9bxxXkKw==}
+    dev: true
+
   /vue-agile@2.0.0:
     resolution: {integrity: sha512-5xkSLJQNRdQ7qpEnXj5FgLg33XKRHaTZKGP5qkvteOc/uGJX89MYCjPSgdNqJ1GYFGfdGAp0jvhihW8OMuXS3g==}
     dependencies: