diff --git a/README.md b/README.md
index 208e9d42338..52705d801b4 100644
--- a/README.md
+++ b/README.md
@@ -12,12 +12,6 @@
-
- 
-
-
- 
-
diff --git a/code/addons/storyshots/storyshots-core/tsconfig.json b/code/addons/storyshots/storyshots-core/tsconfig.json
index ab6daee7ba8..769c5294757 100644
--- a/code/addons/storyshots/storyshots-core/tsconfig.json
+++ b/code/addons/storyshots/storyshots-core/tsconfig.json
@@ -1,7 +1,6 @@
{
"extends": "../../../tsconfig.json",
"compilerOptions": {
- "experimentalDecorators": true,
"declaration": true,
"jsx": "preserve",
"skipLibCheck": true,
diff --git a/code/examples/vue-cli/tsconfig.json b/code/examples/vue-cli/tsconfig.json
index 3c29c2d82ae..a1e7ee2b07c 100644
--- a/code/examples/vue-cli/tsconfig.json
+++ b/code/examples/vue-cli/tsconfig.json
@@ -6,7 +6,6 @@
"jsx": "preserve",
"importHelpers": true,
"moduleResolution": "node",
- "experimentalDecorators": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"sourceMap": true,
diff --git a/code/frameworks/angular/tsconfig.json b/code/frameworks/angular/tsconfig.json
index bdfb3f04899..b39fe09252f 100644
--- a/code/frameworks/angular/tsconfig.json
+++ b/code/frameworks/angular/tsconfig.json
@@ -5,6 +5,8 @@
"target": "ES2020",
"module": "CommonJS",
"lib": ["es2020", "dom"],
+ "experimentalDecorators": true,
+ "emitDecoratorMetadata": true,
"outDir": "dist",
"types": ["node"],
"skipLibCheck": true,
diff --git a/code/frameworks/react-vite/package.json b/code/frameworks/react-vite/package.json
index ece8f749b91..7aa3ec05356 100644
--- a/code/frameworks/react-vite/package.json
+++ b/code/frameworks/react-vite/package.json
@@ -60,7 +60,7 @@
"@storybook/client-api": "7.0.0-alpha.34",
"@storybook/preview-web": "7.0.0-alpha.34",
"@storybook/react": "7.0.0-alpha.34",
- "@vitejs/plugin-react": "^2.0.1",
+ "@vitejs/plugin-react": "^2.0.0",
"ast-types": "^0.14.2",
"magic-string": "^0.26.1",
"react-docgen": "^6.0.0-alpha.3",
diff --git a/code/frameworks/react-vite/src/preset.ts b/code/frameworks/react-vite/src/preset.ts
index 5eae98e6c54..2afd4bed0a6 100644
--- a/code/frameworks/react-vite/src/preset.ts
+++ b/code/frameworks/react-vite/src/preset.ts
@@ -1,7 +1,6 @@
/* eslint-disable global-require */
-import path from 'path';
-import fs from 'fs';
import type { StorybookConfig, TypescriptOptions } from '@storybook/builder-vite';
+import { hasPlugin, readPackageJson } from './utils';
export const addons: StorybookConfig['addons'] = ['@storybook/react'];
@@ -9,25 +8,21 @@ export const core: StorybookConfig['core'] = {
builder: '@storybook/builder-vite',
};
-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;
+ // Add react plugin if not present
+ if (!hasPlugin(plugins, 'vite:react-babel')) {
+ const { default: react } = await import('@vitejs/plugin-react');
+ plugins.push(react());
+ }
+
+ // Add docgen plugin
const { reactDocgen, reactDocgenTypescriptOptions } = await presets.apply(
'typescript',
{} as TypescriptOptions
);
let typescriptPresent;
-
try {
const pkgJson = readPackageJson();
typescriptPresent =
@@ -35,7 +30,6 @@ export const viteFinal: StorybookConfig['viteFinal'] = async (config, { presets
} catch (e) {
typescriptPresent = false;
}
-
if (reactDocgen === 'react-docgen-typescript' && typescriptPresent) {
plugins.push(
require('@joshwooding/vite-plugin-react-docgen-typescript')(reactDocgenTypescriptOptions)
diff --git a/code/frameworks/react-vite/src/utils.ts b/code/frameworks/react-vite/src/utils.ts
new file mode 100644
index 00000000000..851197ad177
--- /dev/null
+++ b/code/frameworks/react-vite/src/utils.ts
@@ -0,0 +1,28 @@
+import path from 'path';
+import fs from 'fs';
+import { PluginOption } from '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);
+}
+
+function checkName(plugin: PluginOption, name: string) {
+ return typeof plugin === 'object' && 'name' in plugin && plugin.name === name;
+}
+
+export function hasPlugin(plugins: PluginOption[], name: string) {
+ return Boolean(
+ plugins.find((p): boolean => {
+ if (Array.isArray(p)) {
+ return Boolean(hasPlugin(p, name));
+ }
+ return checkName(p, name);
+ })
+ );
+}
diff --git a/code/frameworks/svelte-vite/src/preset.ts b/code/frameworks/svelte-vite/src/preset.ts
index 8c0387342d3..b30ad376a94 100644
--- a/code/frameworks/svelte-vite/src/preset.ts
+++ b/code/frameworks/svelte-vite/src/preset.ts
@@ -1,4 +1,5 @@
import type { StorybookConfig } from '@storybook/builder-vite';
+import { hasPlugin } from './utils';
import { svelteDocgen } from './plugins/svelte-docgen';
export const addons: StorybookConfig['addons'] = ['@storybook/svelte'];
@@ -10,6 +11,13 @@ export const core: StorybookConfig['core'] = {
export const viteFinal: StorybookConfig['viteFinal'] = async (config, { presets }) => {
const { plugins = [] } = config;
+ // Add svelte plugin if not present
+ if (!hasPlugin(plugins, 'vite-plugin-svelte')) {
+ const { svelte } = await import('@sveltejs/vite-plugin-svelte');
+ plugins.push(svelte());
+ }
+
+ // Add docgen plugin
plugins.push(svelteDocgen(config));
return {
diff --git a/code/frameworks/svelte-vite/src/utils.ts b/code/frameworks/svelte-vite/src/utils.ts
new file mode 100644
index 00000000000..d6ce9c6bea8
--- /dev/null
+++ b/code/frameworks/svelte-vite/src/utils.ts
@@ -0,0 +1,16 @@
+import { PluginOption } from 'vite';
+
+function checkName(plugin: PluginOption, name: string) {
+ return typeof plugin === 'object' && 'name' in plugin && plugin.name === name;
+}
+
+export function hasPlugin(plugins: PluginOption[], name: string) {
+ return Boolean(
+ plugins.find((p): boolean => {
+ if (Array.isArray(p)) {
+ return Boolean(hasPlugin(p, name));
+ }
+ return checkName(p, name);
+ })
+ );
+}
diff --git a/code/frameworks/vue3-vite/package.json b/code/frameworks/vue3-vite/package.json
index 5341df7086c..c971363dc73 100644
--- a/code/frameworks/vue3-vite/package.json
+++ b/code/frameworks/vue3-vite/package.json
@@ -59,7 +59,7 @@
"@storybook/core-server": "7.0.0-alpha.34",
"@storybook/preview-web": "7.0.0-alpha.34",
"@storybook/vue3": "7.0.0-alpha.34",
- "@vitejs/plugin-vue": "^3.0.3",
+ "@vitejs/plugin-vue": "^3.0.0",
"magic-string": "^0.26.1",
"vite": "^3.1.3",
"vue-docgen-api": "^4.40.0"
diff --git a/code/frameworks/vue3-vite/src/preset.ts b/code/frameworks/vue3-vite/src/preset.ts
index 3f35bed8b1c..fae1204c016 100644
--- a/code/frameworks/vue3-vite/src/preset.ts
+++ b/code/frameworks/vue3-vite/src/preset.ts
@@ -1,7 +1,6 @@
-import path from 'path';
-import fs from 'fs';
import type { StorybookConfig } from '@storybook/builder-vite';
import { vueDocgen } from './plugins/vue-docgen';
+import { hasPlugin } from './utils';
export const addons: StorybookConfig['addons'] = ['@storybook/vue3'];
@@ -9,19 +8,16 @@ 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;
+ // Add vue plugin if not present
+ if (!hasPlugin(plugins, 'vite:vue')) {
+ const { default: vue } = await import('@vitejs/plugin-vue');
+ plugins.push(vue());
+ }
+
+ // Add docgen plugin
plugins.push(vueDocgen());
const updated = {
diff --git a/code/frameworks/vue3-vite/src/utils.ts b/code/frameworks/vue3-vite/src/utils.ts
new file mode 100644
index 00000000000..d6ce9c6bea8
--- /dev/null
+++ b/code/frameworks/vue3-vite/src/utils.ts
@@ -0,0 +1,16 @@
+import { PluginOption } from 'vite';
+
+function checkName(plugin: PluginOption, name: string) {
+ return typeof plugin === 'object' && 'name' in plugin && plugin.name === name;
+}
+
+export function hasPlugin(plugins: PluginOption[], name: string) {
+ return Boolean(
+ plugins.find((p): boolean => {
+ if (Array.isArray(p)) {
+ return Boolean(hasPlugin(p, name));
+ }
+ return checkName(p, name);
+ })
+ );
+}
diff --git a/code/lib/core-common/tsconfig.json b/code/lib/core-common/tsconfig.json
index d17ffdd4aed..41ca5ea687e 100644
--- a/code/lib/core-common/tsconfig.json
+++ b/code/lib/core-common/tsconfig.json
@@ -1,7 +1,6 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
- "emitDecoratorMetadata": false,
"strict": true
},
"include": ["src/**/*"],
diff --git a/code/tsconfig.json b/code/tsconfig.json
index 0621f43a0c4..0d84d7dc1b8 100644
--- a/code/tsconfig.json
+++ b/code/tsconfig.json
@@ -5,8 +5,6 @@
"incremental": false,
"noImplicitAny": true,
"forceConsistentCasingInFileNames": true,
- "experimentalDecorators": true,
- "emitDecoratorMetadata": true,
"jsx": "react",
"moduleResolution": "Node",
"target": "ES2020",
diff --git a/code/yarn.lock b/code/yarn.lock
index 6449f6e663b..23cbece1fb9 100644
--- a/code/yarn.lock
+++ b/code/yarn.lock
@@ -8486,7 +8486,7 @@ __metadata:
"@storybook/preview-web": 7.0.0-alpha.34
"@storybook/react": 7.0.0-alpha.34
"@types/node": ^14.14.20 || ^16.0.0
- "@vitejs/plugin-react": ^2.0.1
+ "@vitejs/plugin-react": ^2.0.0
ast-types: ^0.14.2
magic-string: ^0.26.1
react-docgen: ^6.0.0-alpha.3
@@ -9182,7 +9182,7 @@ __metadata:
"@storybook/preview-web": 7.0.0-alpha.34
"@storybook/vue3": 7.0.0-alpha.34
"@types/node": ^14.14.20 || ^16.0.0
- "@vitejs/plugin-vue": ^3.0.3
+ "@vitejs/plugin-vue": ^3.0.0
magic-string: ^0.26.1
typescript: ~4.6.3
vite: ^3.1.3
@@ -11013,7 +11013,7 @@ __metadata:
languageName: node
linkType: hard
-"@vitejs/plugin-react@npm:^2.0.0, @vitejs/plugin-react@npm:^2.0.1":
+"@vitejs/plugin-react@npm:^2.0.0":
version: 2.1.0
resolution: "@vitejs/plugin-react@npm:2.1.0"
dependencies:
@@ -11030,7 +11030,7 @@ __metadata:
languageName: node
linkType: hard
-"@vitejs/plugin-vue@npm:^3.0.3":
+"@vitejs/plugin-vue@npm:^3.0.0":
version: 3.1.0
resolution: "@vitejs/plugin-vue@npm:3.1.0"
peerDependencies:
@@ -11040,6 +11040,16 @@ __metadata:
languageName: node
linkType: hard
+"@vitejs/plugin-vue@npm:^3.0.3":
+ version: 3.1.2
+ resolution: "@vitejs/plugin-vue@npm:3.1.2"
+ peerDependencies:
+ vite: ^3.0.0
+ vue: ^3.2.25
+ checksum: 53867c9367f1133305e858541a9094a44c5e60d82d0c68d5eb41194dcac01ecd273252786046b3e523d40112374ac7f47558f7b292394a4529355d64b82c04cf
+ languageName: node
+ linkType: hard
+
"@vue/babel-helper-vue-jsx-merge-props@npm:^1.4.0":
version: 1.4.0
resolution: "@vue/babel-helper-vue-jsx-merge-props@npm:1.4.0"
diff --git a/scripts/prepare/bundle.ts b/scripts/prepare/bundle.ts
index c6967d72570..f744220ea5e 100755
--- a/scripts/prepare/bundle.ts
+++ b/scripts/prepare/bundle.ts
@@ -6,6 +6,7 @@ import { build } from 'tsup';
import aliasPlugin from 'esbuild-plugin-alias';
import dedent from 'ts-dedent';
import { exec } from '../utils/exec';
+import slash from 'slash';
const hasFlag = (flags: string[], name: string) => !!flags.find((s) => s.startsWith(`--${name}`));
@@ -54,7 +55,7 @@ const run = async ({ cwd, flags }: { cwd: string; flags: string[] }) => {
const tsConfigExists = await fs.pathExists(tsConfigPath);
await Promise.all([
build({
- entry: entries.map((e: string) => join(cwd, e)),
+ entry: entries.map((e: string) => slash(join(cwd, e))),
watch,
...(tsConfigExists ? { tsconfig: tsConfigPath } : {}),
outDir: join(process.cwd(), 'dist'),
@@ -101,7 +102,7 @@ const run = async ({ cwd, flags }: { cwd: string; flags: string[] }) => {
},
}),
build({
- entry: entries.map((e: string) => join(cwd, e)),
+ entry: entries.map((e: string) => slash(join(cwd, e))),
watch,
outDir: join(process.cwd(), 'dist'),
...(tsConfigExists ? { tsconfig: tsConfigPath } : {}),
diff --git a/scripts/tasks/chromatic.ts b/scripts/tasks/chromatic.ts
index 301503f5144..4fd2b204a63 100644
--- a/scripts/tasks/chromatic.ts
+++ b/scripts/tasks/chromatic.ts
@@ -8,7 +8,7 @@ export const chromatic: Task = {
return false;
},
async run({ key, sandboxDir, builtSandboxDir, junitFilename }, { dryRun, debug }) {
- const tokenEnvVarName = `CHROMATIC_TOKEN_${key.toUpperCase().replace(/\/|-/g, '_')}`;
+ const tokenEnvVarName = `CHROMATIC_TOKEN_${key.toUpperCase().replace(/\/|-|\./g, '_')}`;
const token = process.env[tokenEnvVarName];
await exec(
diff --git a/scripts/tsconfig.json b/scripts/tsconfig.json
index be9aca57342..19b4e68d427 100644
--- a/scripts/tsconfig.json
+++ b/scripts/tsconfig.json
@@ -1,12 +1,9 @@
{
"compileOnSave": false,
-
"compilerOptions": {
"baseUrl": ".",
"incremental": false,
"noImplicitAny": true,
- "experimentalDecorators": true,
- "emitDecoratorMetadata": false,
"jsx": "react",
"moduleResolution": "Node",
"target": "ES2020",
@@ -20,8 +17,6 @@
"dom",
"esnext"
],
-
-
"types": [
"node",
"jest"
@@ -35,7 +30,9 @@
"noFallthroughCasesInSwitch": true,
"resolveJsonModule": true,
"paths": {
- "verdaccio": ["./typings.d.ts"]
+ "verdaccio": [
+ "./typings.d.ts"
+ ]
}
},
"exclude": [
@@ -48,7 +45,9 @@
"**/*.test.ts",
"**/setup-jest.ts"
],
- "include": ["./**/*"],
+ "include": [
+ "./**/*"
+ ],
"ts-node": {
"transpileOnly": true,
"files": true,
@@ -58,4 +57,4 @@
]
}
}
-}
+}
\ No newline at end of file