From de738d4fce0f9abecc41ab075dab14daab8d71de Mon Sep 17 00:00:00 2001 From: Ian VanSchooten Date: Wed, 24 Aug 2022 14:55:39 -0400 Subject: [PATCH] Remove vue3-vite We'll re-add it later, trying to get react working and mergable for now. --- code/frameworks/vue3-vite/README.md | 1 - code/frameworks/vue3-vite/package.json | 100 ------------------ code/frameworks/vue3-vite/preset.js | 2 - code/frameworks/vue3-vite/src/index.ts | 1 - .../docgen-handlers/actualNameHandler.ts | 48 --------- .../vue3-vite/src/plugins/vue-docgen.ts | 27 ----- code/frameworks/vue3-vite/src/preset.ts | 53 ---------- code/frameworks/vue3-vite/src/typings.d.ts | 46 -------- code/frameworks/vue3-vite/tsconfig.json | 10 -- .../src/automigrate/fixes/new-frameworks.ts | 1 - code/lib/cli/src/repro-templates.ts | 24 ----- code/lib/cli/src/versions.ts | 1 - code/nx.json | 3 +- code/package.json | 1 - code/workspace.json | 1 - code/yarn.lock | 94 +--------------- 16 files changed, 2 insertions(+), 411 deletions(-) delete mode 100644 code/frameworks/vue3-vite/README.md delete mode 100644 code/frameworks/vue3-vite/package.json delete mode 100644 code/frameworks/vue3-vite/preset.js delete mode 100644 code/frameworks/vue3-vite/src/index.ts delete mode 100644 code/frameworks/vue3-vite/src/plugins/docgen-handlers/actualNameHandler.ts delete mode 100644 code/frameworks/vue3-vite/src/plugins/vue-docgen.ts delete mode 100644 code/frameworks/vue3-vite/src/preset.ts delete mode 100644 code/frameworks/vue3-vite/src/typings.d.ts delete mode 100644 code/frameworks/vue3-vite/tsconfig.json diff --git a/code/frameworks/vue3-vite/README.md b/code/frameworks/vue3-vite/README.md deleted file mode 100644 index e8a35450aec..00000000000 --- a/code/frameworks/vue3-vite/README.md +++ /dev/null @@ -1 +0,0 @@ -# Storybook for React diff --git a/code/frameworks/vue3-vite/package.json b/code/frameworks/vue3-vite/package.json deleted file mode 100644 index 2aead354128..00000000000 --- a/code/frameworks/vue3-vite/package.json +++ /dev/null @@ -1,100 +0,0 @@ -{ - "name": "@storybook/vue3-vite", - "version": "7.0.0-alpha.24", - "description": "Storybook for Vue3: Develop Vue3 Component in isolation with Hot Reloading.", - "keywords": [ - "storybook" - ], - "homepage": "https://github.com/storybookjs/storybook/tree/main/frameworks/vue3-vite", - "bugs": { - "url": "https://github.com/storybookjs/storybook/issues" - }, - "repository": { - "type": "git", - "url": "https://github.com/storybookjs/storybook.git", - "directory": "frameworks/vue3-vite" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/storybook" - }, - "license": "MIT", - "exports": { - ".": { - "require": "./dist/index.js", - "import": "./dist/index.mjs", - "types": "./dist/index.d.ts" - }, - "./preset": { - "require": "./dist/preset.js", - "import": "./dist/preset.mjs", - "types": "./dist/preset.d.ts" - }, - "./package.json": { - "require": "./package.json", - "import": "./package.json", - "types": "./package.json" - } - }, - "main": "dist/index.js", - "module": "dist/index.mjs", - "types": "dist/index.d.ts", - "files": [ - "dist/**/*", - "types/**/*", - "README.md", - "*.js", - "*.d.ts" - ], - "scripts": { - "check": "tsc --noEmit", - "prepare": "../../../scripts/prepare/bundle.ts" - }, - "dependencies": { - "@rollup/pluginutils": "^4.2.0", - "@storybook/builder-vite": "7.0.0-alpha.24", - "@storybook/core-server": "7.0.0-alpha.24", - "@storybook/core-vite": "7.0.0-alpha.24", - "@storybook/vue3": "7.0.0-alpha.24", - "@types/node": "^14.14.20 || ^16.0.0", - "@vitejs/plugin-vue": "^3.0.3", - "ast-types": "^0.14.2", - "core-js": "^3.8.2", - "magic-string": "^0.26.1", - "react-docgen": "6.0.0-alpha.1", - "regenerator-runtime": "^0.13.7", - "vite": "3", - "vue-docgen-api": "^4.40.0" - }, - "devDependencies": { - "jest-specific-snapshot": "^4.0.0", - "typescript": "~4.6.3" - }, - "peerDependencies": { - "@babel/core": "^7.11.5", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "@babel/core": { - "optional": true - }, - "typescript": { - "optional": true - } - }, - "engines": { - "node": ">=10.13.0" - }, - "publishConfig": { - "access": "public" - }, - "bundler": { - "entries": [ - "./src/index.ts", - "./src/preset.ts" - ], - "platform": "node" - }, - "gitHead": "55247a8e36da7061bfced80c588a539d3fda3f04" -} diff --git a/code/frameworks/vue3-vite/preset.js b/code/frameworks/vue3-vite/preset.js deleted file mode 100644 index 2e3d77f1dea..00000000000 --- a/code/frameworks/vue3-vite/preset.js +++ /dev/null @@ -1,2 +0,0 @@ -console.log('vue3-vite preset!') -module.exports = require('./dist/preset'); diff --git a/code/frameworks/vue3-vite/src/index.ts b/code/frameworks/vue3-vite/src/index.ts deleted file mode 100644 index cf9a0c07e40..00000000000 --- a/code/frameworks/vue3-vite/src/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from '@storybook/vue3'; diff --git a/code/frameworks/vue3-vite/src/plugins/docgen-handlers/actualNameHandler.ts b/code/frameworks/vue3-vite/src/plugins/docgen-handlers/actualNameHandler.ts deleted file mode 100644 index 4849df62d08..00000000000 --- a/code/frameworks/vue3-vite/src/plugins/docgen-handlers/actualNameHandler.ts +++ /dev/null @@ -1,48 +0,0 @@ -/** - * This is heavily based on the react-docgen `displayNameHandler` - * (https://github.com/reactjs/react-docgen/blob/26c90c0dd105bf83499a83826f2a6ff7a724620d/src/handlers/displayNameHandler.ts) - * but instead defines an `actualName` property on the generated docs that is taken first from the component's actual name. - * This addresses an issue where the name that the generated docs are stored under is incorrectly named with the `displayName` - * and not the component's actual name. - * - * This is inspired by `actualNameHandler` from https://github.com/storybookjs/babel-plugin-react-docgen, but is modified - * directly from displayNameHandler, using the same approach as babel-plugin-react-docgen. - */ - -import { namedTypes as t } from 'ast-types'; -import type { NodePath } from 'ast-types/lib/node-path'; -import { getNameOrValue, isReactForwardRefCall } from 'react-docgen/lib/utils'; -import type { Importer } from 'react-docgen/lib/parse'; -import type Documentation from 'react-docgen/lib/Documentation'; - -export default function actualNameHandler( - documentation: Documentation, - path: NodePath, - importer: Importer -): void { - if (t.ClassDeclaration.check(path.node) || t.FunctionDeclaration.check(path.node)) { - documentation.set('actualName', getNameOrValue(path.get('id'))); - } else if ( - t.ArrowFunctionExpression.check(path.node) || - t.FunctionExpression.check(path.node) || - isReactForwardRefCall(path, importer) - ) { - let currentPath = path; - while (currentPath.parent) { - if (t.VariableDeclarator.check(currentPath.parent.node)) { - documentation.set('actualName', getNameOrValue(currentPath.parent.get('id'))); - return; - } - if (t.AssignmentExpression.check(currentPath.parent.node)) { - const leftPath = currentPath.parent.get('left'); - if (t.Identifier.check(leftPath.node) || t.Literal.check(leftPath.node)) { - documentation.set('actualName', getNameOrValue(leftPath)); - return; - } - } - currentPath = currentPath.parent; - } - // Could not find an actual name - documentation.set('actualName', ''); - } -} diff --git a/code/frameworks/vue3-vite/src/plugins/vue-docgen.ts b/code/frameworks/vue3-vite/src/plugins/vue-docgen.ts deleted file mode 100644 index 066b44df134..00000000000 --- a/code/frameworks/vue3-vite/src/plugins/vue-docgen.ts +++ /dev/null @@ -1,27 +0,0 @@ -import { parse } from 'vue-docgen-api'; -import type { Plugin } from 'vite'; -import { createFilter } from 'vite'; -import MagicString from 'magic-string'; - -export function vueDocgen(): Plugin { - const include = /\.(vue)$/; - const filter = createFilter(include); - - return { - name: 'vue-docgen', - - async transform(src: string, id: string) { - if (!filter(id)) return undefined; - - const metaData = await parse(id); - const metaSource = JSON.stringify(metaData); - const s = new MagicString(src); - s.append(`;_sfc_main.__docgenInfo = ${metaSource}`); - - return { - code: s.toString(), - map: s.generateMap({ hires: true, source: id }), - }; - }, - }; -} diff --git a/code/frameworks/vue3-vite/src/preset.ts b/code/frameworks/vue3-vite/src/preset.ts deleted file mode 100644 index f97ea61d0af..00000000000 --- a/code/frameworks/vue3-vite/src/preset.ts +++ /dev/null @@ -1,53 +0,0 @@ -import path from 'path'; -import fs from 'fs'; -import type { StorybookConfig, TypescriptOptions } from '@storybook/core-vite'; - -export const addons: StorybookConfig['addons'] = ['@storybook/vue3']; - -export const core: StorybookConfig['core'] = { - builder: '@storybook/builder-vite', -}; - -export function readPackageJson(): Record | false { - const packageJsonPath = path.resolve('package.json'); - if (!fs.existsSync(packageJsonPath)) { - return false; - } - - const jsonContent = fs.readFileSync(packageJsonPath, 'utf8'); - return JSON.parse(jsonContent); -} - -export const viteFinal: StorybookConfig['viteFinal'] = async (config, { presets }) => { - const { plugins = [] } = config; - - try { - // eslint-disable-next-line global-require - const vuePlugin = require('@vitejs/plugin-vue'); - plugins.push(vuePlugin()); - const { vueDocgen } = await import('./plugins/vue-docgen'); - plugins.push(vueDocgen()); - } catch (err) { - if ((err as NodeJS.ErrnoException).code === 'MODULE_NOT_FOUND') { - throw new Error( - '@storybook/builder-vite requires @vitejs/plugin-vue to be installed ' + - 'when using @storybook/vue or @storybook/vue3.' + - ' Please install it and start storybook again.' - ); - } - throw err; - } - - const updated = { - ...config, - plugins, - resolve: { - ...config?.resolve, - alias: { - ...config?.resolve?.alias, - vue: 'vue/dist/vue.esm-bundler.js', - }, - }, - }; - return updated; -}; diff --git a/code/frameworks/vue3-vite/src/typings.d.ts b/code/frameworks/vue3-vite/src/typings.d.ts deleted file mode 100644 index f21e29cca31..00000000000 --- a/code/frameworks/vue3-vite/src/typings.d.ts +++ /dev/null @@ -1,46 +0,0 @@ -declare module '@storybook/semver'; -declare module 'global'; - -// TODO: Replace, as soon as @types/react-dom 17.0.14 is used -// Source: https://github.com/DefinitelyTyped/DefinitelyTyped/blob/fb0f14b7a35cde26ffaa82e7536c062e593e9ae6/types/react-dom/client.d.ts -declare module 'react-dom/client' { - import React = require('react'); - export interface HydrationOptions { - onHydrated?(suspenseInstance: Comment): void; - onDeleted?(suspenseInstance: Comment): void; - /** - * Prefix for `useId`. - */ - identifierPrefix?: string; - onRecoverableError?: (error: unknown) => void; - } - - export interface RootOptions { - /** - * Prefix for `useId`. - */ - identifierPrefix?: string; - onRecoverableError?: (error: unknown) => void; - } - - export interface Root { - render(children: React.ReactChild | Iterable): void; - unmount(): void; - } - - /** - * Replaces `ReactDOM.render` when the `.render` method is called and enables Concurrent Mode. - * - * @see https://reactjs.org/docs/concurrent-mode-reference.html#createroot - */ - export function createRoot( - container: Element | Document | DocumentFragment | Comment, - options?: RootOptions - ): Root; - - export function hydrateRoot( - container: Element | Document | DocumentFragment | Comment, - initialChildren: React.ReactChild | Iterable, - options?: HydrationOptions - ): Root; -} diff --git a/code/frameworks/vue3-vite/tsconfig.json b/code/frameworks/vue3-vite/tsconfig.json deleted file mode 100644 index 534e4ddd108..00000000000 --- a/code/frameworks/vue3-vite/tsconfig.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "extends": "../../tsconfig.json", - "compilerOptions": { - "rootDir": "./src", - "types": ["node"], - "resolveJsonModule": true - }, - "include": ["src/**/*"], - "exclude": ["src/**/*.test.*", "src/**/__testfixtures__/**"] -} diff --git a/code/lib/cli/src/automigrate/fixes/new-frameworks.ts b/code/lib/cli/src/automigrate/fixes/new-frameworks.ts index 24864113d31..ef12777ecee 100644 --- a/code/lib/cli/src/automigrate/fixes/new-frameworks.ts +++ b/code/lib/cli/src/automigrate/fixes/new-frameworks.ts @@ -30,7 +30,6 @@ const packagesMap = { }, '@storybook/vue3': { webpack5: '@storybook/vue3-webpack5', - vite: '@storybook/vue3-vite', }, '@storybook/svelte': { webpack5: '@storybook/svelte-webpack5', diff --git a/code/lib/cli/src/repro-templates.ts b/code/lib/cli/src/repro-templates.ts index 4d207325f24..84af30f135a 100644 --- a/code/lib/cli/src/repro-templates.ts +++ b/code/lib/cli/src/repro-templates.ts @@ -44,33 +44,9 @@ const reactViteTemplates = { }, }; -const vue3ViteTemplates = { - 'vue3-vite/default-js': { - name: 'Vue3 Vite (JS)', - script: 'yarn create vite . --template vue', - cadence: ['ci', 'daily', 'weekly'], - expected: { - framework: '@storybook/vue3-vite', - renderer: '@storybook/vue3', - builder: '@storybook/builder-vite', - }, - }, - 'vue3-vite/default-ts': { - name: 'Vue3 Vite (TS)', - script: 'yarn create vite . --template vue-ts', - cadence: ['ci', 'daily', 'weekly'], - expected: { - framework: '@storybook/vue3-vite', - renderer: '@storybook/vue3', - builder: '@storybook/builder-vite', - }, - }, -}; - export default { ...craTemplates, ...reactViteTemplates, - ...vue3ViteTemplates, // FIXME: missing documentation.json // 'angular/latest': { // name: 'Angular (latest)', diff --git a/code/lib/cli/src/versions.ts b/code/lib/cli/src/versions.ts index ffa3398bac2..64816bd36ad 100644 --- a/code/lib/cli/src/versions.ts +++ b/code/lib/cli/src/versions.ts @@ -73,7 +73,6 @@ export default { '@storybook/vue': '7.0.0-alpha.24', '@storybook/vue-webpack5': '7.0.0-alpha.24', '@storybook/vue3': '7.0.0-alpha.24', - '@storybook/vue3-vite': '7.0.0-alpha.24', '@storybook/vue3-webpack5': '7.0.0-alpha.24', '@storybook/web-components': '7.0.0-alpha.24', '@storybook/web-components-webpack5': '7.0.0-alpha.24', diff --git a/code/nx.json b/code/nx.json index 15d50f18e99..479bd4247ac 100644 --- a/code/nx.json +++ b/code/nx.json @@ -121,8 +121,7 @@ "@storybook/vue3-webpack5": { "implicitDependencies": [] }, "@storybook/web-components-webpack5": { "implicitDependencies": [] }, - "@storybook/react-vite": { "implicitDependencies": [] }, - "@storybook/vue3-vite": { "implicitDependencies": [] } + "@storybook/react-vite": { "implicitDependencies": [] } }, "affected": { "defaultBase": "next" diff --git a/code/package.json b/code/package.json index e234722471e..7f2c5e76117 100644 --- a/code/package.json +++ b/code/package.json @@ -233,7 +233,6 @@ "@storybook/vue": "workspace:*", "@storybook/vue-webpack5": "workspace:*", "@storybook/vue3": "workspace:*", - "@storybook/vue3-vite": "workspace:*", "@storybook/vue3-webpack5": "workspace:*", "@storybook/web-components": "workspace:*", "@storybook/web-components-webpack5": "workspace:*", diff --git a/code/workspace.json b/code/workspace.json index a0aaff3f7ac..2a31d5f6f9b 100644 --- a/code/workspace.json +++ b/code/workspace.json @@ -42,7 +42,6 @@ }, "@storybook/react-vite": { "root": "frameworks/react-vite", "type": "library" }, - "@storybook/vue3-vite": { "root": "frameworks/vue3-vite", "type": "library" }, "@storybook/core-webpack": { "root": "lib/core-webpack", "type": "library" }, "@storybook/core-vite": { "root": "lib/core-vite", "type": "library" }, diff --git a/code/yarn.lock b/code/yarn.lock index d5a1a230b7f..8ae0cb398a7 100644 --- a/code/yarn.lock +++ b/code/yarn.lock @@ -2397,7 +2397,7 @@ __metadata: languageName: node linkType: hard -"@babel/types@npm:^7.18.10, @babel/types@npm:^7.18.8": +"@babel/types@npm:^7.18.10": version: 7.18.10 resolution: "@babel/types@npm:7.18.10" dependencies: @@ -9254,7 +9254,6 @@ __metadata: "@storybook/vue": "workspace:*" "@storybook/vue-webpack5": "workspace:*" "@storybook/vue3": "workspace:*" - "@storybook/vue3-vite": "workspace:*" "@storybook/vue3-webpack5": "workspace:*" "@storybook/web-components": "workspace:*" "@storybook/web-components-webpack5": "workspace:*" @@ -9752,38 +9751,6 @@ __metadata: languageName: unknown linkType: soft -"@storybook/vue3-vite@workspace:*, @storybook/vue3-vite@workspace:frameworks/vue3-vite": - version: 0.0.0-use.local - resolution: "@storybook/vue3-vite@workspace:frameworks/vue3-vite" - dependencies: - "@rollup/pluginutils": ^4.2.0 - "@storybook/builder-vite": 7.0.0-alpha.24 - "@storybook/core-server": 7.0.0-alpha.24 - "@storybook/core-vite": 7.0.0-alpha.24 - "@storybook/vue3": 7.0.0-alpha.24 - "@types/node": ^14.14.20 || ^16.0.0 - "@vitejs/plugin-vue": ^3.0.3 - ast-types: ^0.14.2 - core-js: ^3.8.2 - jest-specific-snapshot: ^4.0.0 - magic-string: ^0.26.1 - react-docgen: 6.0.0-alpha.1 - regenerator-runtime: ^0.13.7 - typescript: ~4.6.3 - vite: 3 - vue-docgen-api: ^4.40.0 - peerDependencies: - "@babel/core": ^7.11.5 - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - "@babel/core": - optional: true - typescript: - optional: true - languageName: unknown - linkType: soft - "@storybook/vue3-webpack5@7.0.0-alpha.24, @storybook/vue3-webpack5@workspace:*, @storybook/vue3-webpack5@workspace:frameworks/vue3-webpack5": version: 0.0.0-use.local resolution: "@storybook/vue3-webpack5@workspace:frameworks/vue3-webpack5" @@ -11806,16 +11773,6 @@ __metadata: languageName: node linkType: hard -"@vitejs/plugin-vue@npm:^3.0.3": - version: 3.0.3 - resolution: "@vitejs/plugin-vue@npm:3.0.3" - peerDependencies: - vite: ^3.0.0 - vue: ^3.2.25 - checksum: 42ddb22e9b80df16f48826c5911d6aa5b2f81ba4210866c1519b1df181a34d2c231ba7c2d45c1b5aa32e1e88ef03d075b11c8026f2f4b96c4f5c987be0fecb0e - languageName: node - linkType: hard - "@vue/babel-helper-vue-jsx-merge-props@npm:^1.2.1": version: 1.2.1 resolution: "@vue/babel-helper-vue-jsx-merge-props@npm:1.2.1" @@ -13756,15 +13713,6 @@ __metadata: languageName: node linkType: hard -"ast-types@npm:0.15.2": - version: 0.15.2 - resolution: "ast-types@npm:0.15.2" - dependencies: - tslib: ^2.0.1 - checksum: 5b26e3656e9e8d1db8c8d14971d0cb88ca0138aacce72171cb4cd4555fc8dc53c07e821c568e57fe147366931708fefd25cb9d7e880d42ce9cb569947844c962 - languageName: node - linkType: hard - "ast-types@npm:0.9.6": version: 0.9.6 resolution: "ast-types@npm:0.9.6" @@ -37963,18 +37911,6 @@ __metadata: languageName: node linkType: hard -"recast@npm:0.21.1": - version: 0.21.1 - resolution: "recast@npm:0.21.1" - dependencies: - ast-types: 0.15.2 - esprima: ~4.0.0 - source-map: ~0.6.1 - tslib: ^2.0.1 - checksum: f3e103a21594dc3ef1d481f81be327d349798e7d1b9a57cecfac5d4cadc59e3865b12a28f364f7191e158b16c9deaf6cb3341953d591fe63d22e4ad5b6a995dd - languageName: node - linkType: hard - "recast@npm:^0.11.17": version: 0.11.23 resolution: "recast@npm:0.11.23" @@ -44888,25 +44824,6 @@ __metadata: languageName: unknown linkType: soft -"vue-docgen-api@npm:^4.40.0": - version: 4.52.0 - resolution: "vue-docgen-api@npm:4.52.0" - dependencies: - "@babel/parser": ^7.13.12 - "@babel/types": ^7.18.8 - "@vue/compiler-dom": ^3.2.0 - "@vue/compiler-sfc": ^3.2.0 - ast-types: 0.14.2 - hash-sum: ^1.0.2 - lru-cache: ^4.1.5 - pug: ^3.0.2 - recast: 0.21.1 - ts-map: ^1.0.3 - vue-inbrowser-compiler-independent-utils: ^4.52.0 - checksum: 38e7d44205a6fc14fc28c98e77f89fee5167ef0ad59e9083fcf17f8b9fb9e7aa20941a107b6b67fa7f9bfbf5bf0159925ac750b4d99ee06154e01a2695bf58ad - languageName: node - linkType: hard - "vue-docgen-api@npm:^4.44.23, vue-docgen-api@npm:^4.46.0": version: 4.47.0 resolution: "vue-docgen-api@npm:4.47.0" @@ -44996,15 +44913,6 @@ __metadata: languageName: node linkType: hard -"vue-inbrowser-compiler-independent-utils@npm:^4.52.0": - version: 4.52.0 - resolution: "vue-inbrowser-compiler-independent-utils@npm:4.52.0" - peerDependencies: - vue: ">=2" - checksum: 20d8577a94cd7e0a591ba1f0bea7ccbe87d51389b33523ad7b86bc1f6e13c78f3438b837ed78631b6e7cb4ef7a56b1d6d2a70a5f51b6f6fc100d644438ae28aa - languageName: node - linkType: hard - "vue-inbrowser-compiler-utils@npm:^4.44.23": version: 4.46.0 resolution: "vue-inbrowser-compiler-utils@npm:4.46.0"