[dx] reinstall storybook

.gitignore

@@ -19,3 +19,5 @@ dist
 secrets.json
 .ruby-version
 *.orig
+
+*storybook.log

.storybook/main.ts

@@ -1,5 +1,7 @@
-const fs = require("fs");
-const path = require('path');
+import fs from "node:fs";
+import path from 'node:path';
+import vue from '@vitejs/plugin-vue'
+import {fileURLToPath} from "url";
 
 //storybook-tailwind-dark-mode
 const config = {
@@ -19,7 +21,7 @@ const config = {
   ],
 
   framework: {
-    name: "@storybook-vue/nuxt",
+    name: "@storybook/vue3-vite",
     options: {}
   },
 
@@ -40,6 +42,19 @@ const config = {
       STORYBOOK_ICON_SVG_NAMES: allIconNamesList,
     }},
 
+  viteFinal: async (config) => {
+    config.resolve.alias = {
+      ...config.resolve.alias,
+      '#app': fileURLToPath(new URL('../node_modules/nuxt/dist/app', import.meta.url)),
+      '#app/*': fileURLToPath(new URL('../node_modules/nuxt/dist/app/*', import.meta.url)),
+    }
+
+    const { mergeConfig } = await import('vite');
+
+    return mergeConfig(config, {
+      plugins: [vue()],
+    });
+  }
 };
 
 export default config;

nuxt.config.ts

@@ -1,3 +1,4 @@
+import vue from '@vitejs/plugin-vue'
 import {defineNuxtConfig} from "nuxt/config";
 import pkg from './package.json';
 
@@ -47,13 +48,16 @@ export default defineNuxtConfig({
   modules: [
     '@nuxtjs/tailwindcss',
     '@pinia/nuxt',
-    '@nuxtjs/storybook'
   ],
 
   typescript: {
     strict: true,
   },
 
+  build: {
+    transpile: ['@babel/plugin-syntax-import-attributes'],
+  },
+
   devServer: {
     host: '127.0.0.1',
     url: 'http://127.0.0.1:3000',
@@ -65,5 +69,9 @@ export default defineNuxtConfig({
     }
   },
 
+  vite: {
+    plugins: [vue()]
+  },
+
   compatibilityDate: "2024-07-12"
-});
+});

package.json

@@ -11,9 +11,11 @@
     "lint": "yarn codestyle && yarn typecheck",
     "codestyle": "eslint . --fix",
     "typecheck": "tsc --noEmit",
-    "test": "echo \"TODO: need to add tests\""
+    "test": "echo \"TODO: need to add tests\"",
+    "storybook": "storybook dev -p 6006",
+    "sb": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
   },
-  "type": "module",
   "lint-staged": {
     "*.{js,ts}": [
       "eslint --fix"
@@ -29,15 +31,20 @@
     "*.{js,css,md}": "prettier --write"
   },
   "devDependencies": {
+    "@babel/plugin-syntax-import-attributes": "^7.24.7",
+    "@chromatic-com/storybook": "^1.6.1",
     "@conarti/eslint-plugin-feature-sliced": "^1.0.5",
     "@nuxtjs/eslint-config-typescript": "^12.0.0",
-    "@nuxtjs/storybook": "8.1.5",
+    "@nuxtjs/storybook": "^8.1.5",
     "@nuxtjs/tailwindcss": "^6.2.0",
     "@storybook-vue/nuxt": "0.2.10",
     "@storybook/addon-essentials": "^8.1.11",
     "@storybook/addon-interactions": "^8.1.11",
     "@storybook/addon-links": "^8.1.11",
+    "@storybook/blocks": "8.1.11",
+    "@storybook/test": "8.1.11",
     "@storybook/vue3": "^8.1.11",
+    "@storybook/vue3-vite": "8.1.11",
     "@types/cytoscape-dagre": "^2.3.1",
     "@types/downloadjs": "^1.4.3",
     "@types/lodash.debounce": "^4.0.7",
@@ -74,6 +81,7 @@
     "@sentry/types": "^8.15.0",
     "@storybook/addon-actions": "^8.1.11",
     "@types/lodash": "^4.14.200",
+    "@vitejs/plugin-vue": "^5.1.1",
     "@vue/shared": "^3.2.45",
     "@vueuse/core": "^10.11.0",
     "centrifuge": "^5.2.2",
@@ -89,7 +97,7 @@
     "lodash.isstring": "^4.0.1",
     "lodash.pick": "^4.4.0",
     "moment": "^2.29.4",
-    "nuxt": "^3.8.2",
+    "nuxt": "^3.12.4",
     "pinia": "^2.0.30",
     "pluralize": "^8.0.0",
     "tailwindcss": "^3.2.4",