Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Core: Fix package duplication issues by aliasing all storybook packages #11092

Merged
merged 11 commits into from
Jun 11, 2020
Merged

Core: Fix package duplication issues by aliasing all storybook packages #11092

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
b4bf235
FIX paths and minification
ndelangen Jun 9, 2020
541ce5c
FIX versions
ndelangen Jun 9, 2020
f48edc7
FIX alias pathing
ndelangen Jun 9, 2020
dc65657
Merge branch 'next' into fix/10887
ndelangen Jun 9, 2020
262fca6
disable cra-preset for now
ndelangen Jun 9, 2020
66e04ca
Allow monorepo project root dir to be imported in CRA examples
ndelangen Jun 9, 2020
bec1e35
Merge branch 'next' into fix/10887
ndelangen Jun 10, 2020
0e21344
CLEANUP && FIX main.ts
ndelangen Jun 10, 2020
764b689
CLEANUP as desired
ndelangen Jun 10, 2020
d91e0b2
Merge branch 'next' into fix/10887
ndelangen Jun 11, 2020
6a15159
rename reserve-word variable
ndelangen Jun 11, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion lib/api/src/version.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1 +1 @@
export const version = '6.0.0-beta.22';
export const version = '6.0.0-beta.23';
30 changes: 15 additions & 15 deletions lib/cli/versions.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
{
"@storybook/angular": "6.0.0-beta.22",
"@storybook/aurelia": "6.0.0-beta.22",
"@storybook/ember": "6.0.0-beta.22",
"@storybook/html": "6.0.0-beta.22",
"@storybook/marionette": "6.0.0-beta.22",
"@storybook/marko": "6.0.0-beta.22",
"@storybook/mithril": "6.0.0-beta.22",
"@storybook/preact": "6.0.0-beta.22",
"@storybook/rax": "6.0.0-beta.22",
"@storybook/react": "6.0.0-beta.22",
"@storybook/riot": "6.0.0-beta.22",
"@storybook/server": "6.0.0-beta.22",
"@storybook/svelte": "6.0.0-beta.22",
"@storybook/vue": "6.0.0-beta.22",
"@storybook/web-components": "6.0.0-beta.22"
"@storybook/angular": "6.0.0-beta.23",
"@storybook/aurelia": "6.0.0-beta.23",
"@storybook/ember": "6.0.0-beta.23",
"@storybook/html": "6.0.0-beta.23",
"@storybook/marionette": "6.0.0-beta.23",
"@storybook/marko": "6.0.0-beta.23",
"@storybook/mithril": "6.0.0-beta.23",
"@storybook/preact": "6.0.0-beta.23",
"@storybook/rax": "6.0.0-beta.23",
"@storybook/react": "6.0.0-beta.23",
"@storybook/riot": "6.0.0-beta.23",
"@storybook/server": "6.0.0-beta.23",
"@storybook/svelte": "6.0.0-beta.23",
"@storybook/vue": "6.0.0-beta.23",
"@storybook/web-components": "6.0.0-beta.23"
}
2 changes: 2 additions & 0 deletions lib/core/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,9 @@
"@babel/register": "^7.8.3",
"@storybook/addons": "6.0.0-beta.23",
"@storybook/api": "6.0.0-beta.23",
"@storybook/channels": "6.0.0-beta.23",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These are added to be sure to have them and be able to have a working alias?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah all packages of @storybook/* that are conceivably used are aliased here so that there can only 1 of them in the entire bundle.

"@storybook/channel-postmessage": "6.0.0-beta.23",
"@storybook/components": "6.0.0-beta.23",
"@storybook/client-api": "6.0.0-beta.23",
"@storybook/client-logger": "6.0.0-beta.23",
"@storybook/core-events": "6.0.0-beta.23",
Expand Down
14 changes: 14 additions & 0 deletions lib/core/src/server/manager/manager-webpack.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import HtmlWebpackPlugin from 'html-webpack-plugin';
import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin';
import PnpWebpackPlugin from 'pnp-webpack-plugin';
import VirtualModulePlugin from 'webpack-virtual-modules';
import TerserWebpackPlugin from 'terser-webpack-plugin';

import themingPaths from '@storybook/theming/paths';
import uiPaths from '@storybook/ui/paths';
Expand Down Expand Up @@ -158,6 +159,19 @@ export default async ({
chunks: 'all',
},
runtimeChunk: true,
minimizer: isProd
? [
new TerserWebpackPlugin({
cache: true,
parallel: true,
sourceMap: true,
terserOptions: {
mangle: false,
keep_fnames: true,
},
}),
]
: [],
},
};
};
63 changes: 43 additions & 20 deletions lib/core/src/server/preview/iframe-webpack.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,8 @@ import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';

import resolveFrom from 'resolve-from';

import themingPaths from '@storybook/theming/paths';

import { createBabelLoader } from './babel-loader-preview';
import es6Transpiler from '../common/es6Transpiler';

Expand All @@ -21,6 +23,29 @@ import { toRequireContextString } from './to-require-context';
import { useBaseTsSupport } from '../config/useBaseTsSupport';

const reactPaths = {};
const storybookPaths = {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more. 

const storybookPaths = ['addons', ...other ].reduce((paths,package) => ({
   ...paths, 
   [`@storybook/${package}`]: path.dirname(resolveFrom(__dirname, `@storybook/${package}/package.json`))`
}), {});

Would reduce boilerplate a bit :)

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes please 🙏

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As you wish 🎩

'@storybook/addons': path.dirname(resolveFrom(__dirname, '@storybook/addons/package.json')),
'@storybook/api': path.dirname(resolveFrom(__dirname, '@storybook/api/package.json')),
'@storybook/channels': path.dirname(resolveFrom(__dirname, '@storybook/channels/package.json')),
'@storybook/channel-postmessage': path.dirname(
resolveFrom(__dirname, '@storybook/channel-postmessage/package.json')
),
'@storybook/components': path.dirname(
resolveFrom(__dirname, '@storybook/components/package.json')
),
'@storybook/core-events': path.dirname(
resolveFrom(__dirname, '@storybook/core-events/package.json')
),
'@storybook/router': path.dirname(resolveFrom(__dirname, '@storybook/router/package.json')),
'@storybook/theming': path.dirname(resolveFrom(__dirname, '@storybook/theming/package.json')),
'@storybook/semver': path.dirname(resolveFrom(__dirname, '@storybook/semver/package.json')),
'@storybook/client-api': path.dirname(
resolveFrom(__dirname, '@storybook/client-api/package.json')
),
'@storybook/client-logger': path.dirname(
resolveFrom(__dirname, '@storybook/client-logger/package.json')
),
};
try {
reactPaths.react = path.dirname(resolveFrom(process.cwd(), 'react/package.json'));
reactPaths['react-dom'] = path.dirname(resolveFrom(process.cwd(), 'react-dom/package.json'));
Expand Down Expand Up @@ -64,13 +89,8 @@ export default async ({
const match = entryFilename.match(/(.*)-generated-(config|other)-entry.js$/);
if (match) {
const configFilename = match[1];
const isUsingYarnPnp = typeof process.versions.pnp !== 'undefined';
const clientApi = isUsingYarnPnp
? `${require.resolve('@storybook/client-api')}`
: '@storybook/client-api';
const clientLogger = isUsingYarnPnp
? `${require.resolve('@storybook/client-logger')}`
: '@storybook/client-logger';
const clientApi = storybookPaths['@storybook/client-api'];
const clientLogger = storybookPaths['@storybook/client-logger'];

virtualModuleMapping[entryFilename] = interpolate(entryTemplate, {
configFilename,
Expand Down Expand Up @@ -159,8 +179,9 @@ export default async ({
extensions: ['.mjs', '.js', '.jsx', '.ts', '.tsx', '.json', '.cjs'],
modules: ['node_modules'].concat(raw.NODE_PATH || []),
alias: {
'babel-runtime/core-js/object/assign': require.resolve('core-js/es/object/assign'),
semver: require.resolve('@storybook/semver'),
...themingPaths,
...storybookPaths,
semver: path.dirname(resolveFrom(__dirname, '@storybook/semver/package.json')),
ndelangen marked this conversation as resolved.
Show resolved Hide resolved
...reactPaths,
},

Expand All @@ -177,17 +198,19 @@ export default async ({
chunks: 'all',
},
runtimeChunk: true,
minimizer: [
new TerserWebpackPlugin({
cache: true,
parallel: true,
sourceMap: true,
terserOptions: {
mangle: false,
keep_fnames: true,
},
}),
],
minimizer: isProd
? [
new TerserWebpackPlugin({
cache: true,
parallel: true,
sourceMap: true,
terserOptions: {
mangle: false,
keep_fnames: true,
},
}),
]
: [],
},
performance: {
hints: isProd ? 'warning' : false,
Expand Down