Skip to content

Commit

Permalink
fix(storybook): add vite-tsconfig-paths to storybook
Browse files Browse the repository at this point in the history
  • Loading branch information
@mandarini
mandarini committed Jan 5, 2023
1 parent 49aa44b commit a2af57b
Show file tree
Hide file tree
Showing 5 changed files with 140 additions and 9 deletions.
2 changes: 2 additions & 0 deletions ...src/generators/storybook-configuration/__snapshots__/storybook-configuration.spec.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ exports[`StorybookConfiguration generator should configure storybook to use webp
module.exports = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down
15 changes: 14 additions & 1 deletion ...es/storybook/src/generators/configuration/__snapshots__/configuration-nested.spec.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,8 @@ exports[`@nrwl/storybook:configuration for workspaces with Root project basic fu
import { rootMain } from './main.root';
import type { StorybookConfig, Options } from '@storybook/core-common';
import { mergeConfig } from 'vite';
import viteTsConfigPaths from 'vite-tsconfig-paths';
const config: StorybookConfig = {
...rootMain,
Expand All @@ -17,7 +19,16 @@ const config: StorybookConfig = {
addons: [...(rootMain.addons || [])
]
],
async viteFinal(config: any) {
return mergeConfig(config, {
plugins: [
viteTsConfigPaths({
root: './../',
}),
],
});
},
};
module.exports = config;
Expand Down Expand Up @@ -73,6 +84,8 @@ exports[`@nrwl/storybook:configuration for workspaces with Root project basic fu
import type { StorybookConfig, Options } from '@storybook/core-common';
const config: StorybookConfig = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down
106 changes: 100 additions & 6 deletions packages/storybook/src/generators/configuration/__snapshots__/configuration.spec.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ exports[`@nrwl/storybook:configuration basic functionalities should generate a w
module.exports = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down Expand Up @@ -106,6 +108,8 @@ Array [
exports[`@nrwl/storybook:configuration basic functionalities should reference the "old" webpack.config.js if there - for backwards compatibility 1`] = `
"const rootMain = require('../../../.storybook/main');
const rootWebpackConfig = require('../../../.storybook/webpack.config');
Expand Down Expand Up @@ -145,6 +149,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
import type { StorybookConfig, Options } from '@storybook/core-common';
import { mergeConfig } from 'vite';
import viteTsConfigPaths from 'vite-tsconfig-paths';
const config: StorybookConfig = {
...rootMain,
Expand All @@ -157,7 +163,16 @@ const config: StorybookConfig = {
addons: [...(rootMain.addons || [])
]
],
async viteFinal(config: any) {
return mergeConfig(config, {
plugins: [
viteTsConfigPaths({
root: '../../../',
}),
],
});
},
};
module.exports = config;
Expand Down Expand Up @@ -194,6 +209,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
import type { StorybookConfig, Options } from '@storybook/core-common';
import { mergeConfig } from 'vite';
import viteTsConfigPaths from 'vite-tsconfig-paths';
const config: StorybookConfig = {
...rootMain,
Expand All @@ -206,7 +223,16 @@ const config: StorybookConfig = {
addons: [...(rootMain.addons || [])
]
],
async viteFinal(config: any) {
return mergeConfig(config, {
plugins: [
viteTsConfigPaths({
root: '../../../',
}),
],
});
},
};
module.exports = config;
Expand Down Expand Up @@ -243,6 +269,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
import type { StorybookConfig, Options } from '@storybook/core-common';
import path from 'path';
import { mergeConfig } from 'vite';
import viteTsConfigPaths from 'vite-tsconfig-paths';
const config: StorybookConfig = {
...rootMain,
Expand All @@ -262,7 +290,16 @@ const config: StorybookConfig = {
},
}
]
],
async viteFinal(config: any) {
return mergeConfig(config, {
plugins: [
viteTsConfigPaths({
root: '../../../',
}),
],
});
},
};
module.exports = config;
Expand Down Expand Up @@ -299,6 +336,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
import type { StorybookConfig, Options } from '@storybook/core-common';
import { mergeConfig } from 'vite';
import viteTsConfigPaths from 'vite-tsconfig-paths';
const config: StorybookConfig = {
...rootMain,
Expand All @@ -311,7 +350,16 @@ const config: StorybookConfig = {
addons: [...(rootMain.addons || [])
]
],
async viteFinal(config: any) {
return mergeConfig(config, {
plugins: [
viteTsConfigPaths({
root: '../../../',
}),
],
});
},
};
module.exports = config;
Expand Down Expand Up @@ -348,6 +396,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
import type { StorybookConfig, Options } from '@storybook/core-common';
import { mergeConfig } from 'vite';
import viteTsConfigPaths from 'vite-tsconfig-paths';
const config: StorybookConfig = {
...rootMain,
Expand All @@ -360,7 +410,16 @@ const config: StorybookConfig = {
addons: [...(rootMain.addons || [])
, 'storybook-addon-swc'
]
],
async viteFinal(config: any) {
return mergeConfig(config, {
plugins: [
viteTsConfigPaths({
root: '../../../',
}),
],
});
},
};
module.exports = config;
Expand Down Expand Up @@ -397,6 +456,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
import type { StorybookConfig, Options } from '@storybook/core-common';
import { mergeConfig } from 'vite';
import viteTsConfigPaths from 'vite-tsconfig-paths';
const config: StorybookConfig = {
...rootMain,
Expand All @@ -409,7 +470,16 @@ const config: StorybookConfig = {
addons: [...(rootMain.addons || [])
]
],
async viteFinal(config: any) {
return mergeConfig(config, {
plugins: [
viteTsConfigPaths({
root: '../../../',
}),
],
});
},
};
module.exports = config;
Expand Down Expand Up @@ -447,6 +517,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
import type { StorybookConfig, Options } from '@storybook/core-common';
const config: StorybookConfig = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down Expand Up @@ -506,6 +578,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
import type { StorybookConfig, Options } from '@storybook/core-common';
const config: StorybookConfig = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down Expand Up @@ -565,6 +639,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
import type { StorybookConfig, Options } from '@storybook/core-common';
import path from 'path';
const config: StorybookConfig = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down Expand Up @@ -631,6 +707,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
import type { StorybookConfig, Options } from '@storybook/core-common';
const config: StorybookConfig = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down Expand Up @@ -690,6 +768,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
import type { StorybookConfig, Options } from '@storybook/core-common';
const config: StorybookConfig = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down Expand Up @@ -749,6 +829,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
import type { StorybookConfig, Options } from '@storybook/core-common';
const config: StorybookConfig = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down Expand Up @@ -808,6 +890,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
module.exports = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down Expand Up @@ -866,6 +950,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
module.exports = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down Expand Up @@ -922,6 +1008,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
"const rootMain = require('../../../.storybook/main');
const path = require('path');
module.exports = {
Expand Down Expand Up @@ -989,6 +1077,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
module.exports = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down Expand Up @@ -1047,6 +1137,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
module.exports = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down Expand Up @@ -1105,6 +1197,8 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
module.exports = {
...rootMain,
core: { ...rootMain.core, builder: 'webpack5' },
Expand Down
13 changes: 12 additions & 1 deletion packages/storybook/src/generators/configuration/project-files-ts/.storybook/main.ts__tmpl__
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@
<% if (isRootProject){ %>import { rootMain } from './main.root';<% } %>
import type { StorybookConfig, Options } from '@storybook/core-common';
<% if (isNextJs){ %>import path from 'path';<% } %>
<% if (usesVite){ %>import { mergeConfig } from 'vite';<% } %>
<% if (usesVite){ %>import viteTsConfigPaths from 'vite-tsconfig-paths';<% } %>

const config: StorybookConfig = {
...rootMain,
Expand All @@ -23,7 +25,16 @@ const config: StorybookConfig = {
},
}
<% } %>
]<% if (!usesVite) { %>,
]<% if (usesVite) { %>,
async viteFinal(config: any) {
return mergeConfig(config, {
plugins: [
viteTsConfigPaths({
root: '<%= offsetFromRoot %>../',
}),
],
});
},<% } %><% if (!usesVite) { %>,
webpackFinal: async (config, { configType }: Options) => {
// apply any global webpack configs that might have been specified in .storybook/main.ts
if (rootMain.webpackFinal) {
Expand Down
13 changes: 12 additions & 1 deletion packages/storybook/src/generators/configuration/project-files/.storybook/main.js__tmpl__
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
<% if (!isRootProject){ %>const rootMain = require('<%= offsetFromRoot %>../.storybook/<%= rootMainName %>');<% } %>
<% if (isRootProject){ %>const rootMain = require('./main.root');<% } %>
<% if (usesVite){ %>const { mergeConfig } = require('vite');<% } %>
<% if (usesVite){ %>const viteTsConfigPaths = require('vite-tsconfig-paths').default;<% } %>
<% if (existsRootWebpackConfig && !usesVite){ %>const rootWebpackConfig = require('<%= offsetFromRoot %>../.storybook/webpack.config'); <% } %>
<% if (isNextJs){ %>const path = require('path');<% } %>

Expand All @@ -23,7 +25,16 @@ module.exports = {
},
}
<% } %>
]<% if (!usesVite) { %>,
]<% if (usesVite) { %>,
async viteFinal(config, { configType }) {
return mergeConfig(config, {
plugins: [
viteTsConfigPaths({
root: '<%= offsetFromRoot %>../',
}),
],
});
},<% } %><% if (!usesVite) { %>,
webpackFinal: async (config, { configType }) => {
// apply any global webpack configs that might have been specified in .storybook/main.js
if (rootMain.webpackFinal) {
Expand Down

0 comments on commit a2af57b

Please sign in to comment.