Skip to content

Commit

Permalink
Merge pull request #17304 from storybookjs/tech/bundling-components
Browse files Browse the repository at this point in the history 
UI: Prebundle `@storybook/components`
  • Loading branch information
@shilman
shilman authored Feb 4, 2022
2 parents 3abcb26 + 8dcd346 commit 1f72bf9
Show file tree
Hide file tree
Showing 25 changed files with 151 additions and 169 deletions.
19 changes: 12 additions & 7 deletions .eslintrc.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,18 @@ module.exports = {
],
},
overrides: [
{
// this package uses pre-bundling, dependencies will be bundled, and will be in devDepenencies
files: [
'**/lib/theming/**/*',
'**/lib/router/**/*',
'**/lib/ui/**/*',
'**/lib/components/**/*',
],
rules: {
'import/no-extraneous-dependencies': ['error', { bundledDependencies: false }],
},
},
{
files: [
'**/__tests__/**',
Expand Down Expand Up @@ -72,12 +84,5 @@ module.exports = {
'react/no-unknown-property': 'off', // Need to deactivate otherwise eslint replaces some unknown properties with React ones
},
},
{
// this package uses pre-bundling, dependencies will be bundled, and will be in devDepenencies
files: ['**/lib/theming/**/*', '**/lib/router/**/*', '**/lib/ui/**/*'],
rules: {
'import/no-extraneous-dependencies': ['error', { bundledDependencies: false }],
},
},
],
};
2 changes: 1 addition & 1 deletion addons/storysource/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@
"regenerator-runtime": "^0.13.7"
},
"devDependencies": {
"@types/react": "^16.14.2",
"@types/react": "^16.14.23",
"@types/react-syntax-highlighter": "^11.0.5"
},
"peerDependencies": {
Expand Down
6 changes: 4 additions & 2 deletions app/angular/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,6 +55,8 @@
"@storybook/semver": "^7.3.2",
"@storybook/store": "6.5.0-alpha.35",
"@types/node": "^14.14.20 || ^16.0.0",
"@types/react": "^16.14.23",
"@types/react-dom": "^16.9.14",
"@types/webpack-env": "^1.16.0",
"autoprefixer": "^9.8.6",
"core-js": "^3.8.2",
Expand All @@ -64,8 +66,8 @@
"postcss": "^7.0.36",
"postcss-loader": "^4.2.0",
"raw-loader": "^4.0.2",
"react": "16.14.0",
"react-dom": "16.14.0",
"react": "^16.14.0",
"react-dom": "^16.14.0",
"read-pkg-up": "^7.0.1",
"regenerator-runtime": "^0.13.7",
"sass-loader": "^10.1.0",
Expand Down
4 changes: 2 additions & 2 deletions examples/cra-ts-essentials/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,8 @@
"dependencies": {
"@types/jest": "^26.0.16",
"@types/node": "^14.14.20 || ^16.0.0",
"@types/react": "^16.14.2",
"@types/react-dom": "16.9.10",
"@types/react": "^16.14.23",
"@types/react-dom": "^16.9.14",
"global": "^4.4.0",
"react": "16.14.0",
"react-dom": "16.14.0",
Expand Down
4 changes: 2 additions & 2 deletions examples/cra-ts-kitchen-sink/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,8 @@
"dependencies": {
"@types/jest": "25.2.3",
"@types/node": "^14.14.20 || ^16.0.0",
"@types/react": "16.14.2",
"@types/react-dom": "16.9.10",
"@types/react": "^16.14.23",
"@types/react-dom": "^16.9.14",
"prop-types": "^15.7.2",
"react": "16.14.0",
"react-dom": "16.14.0",
Expand Down
4 changes: 2 additions & 2 deletions examples/react-ts-webpack4/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,8 @@
"@storybook/addon-essentials": "6.5.0-alpha.35",
"@storybook/builder-webpack4": "6.5.0-alpha.35",
"@storybook/react": "6.5.0-alpha.35",
"@types/react": "^16.14.2",
"@types/react-dom": "^16.9.10",
"@types/react": "^16.14.23",
"@types/react-dom": "^16.9.14",
"prop-types": "15.7.2",
"react": "16.14.0",
"react-dom": "16.14.0",
Expand Down
4 changes: 2 additions & 2 deletions examples/react-ts/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,8 +28,8 @@
"@testing-library/dom": "^7.31.2",
"@testing-library/user-event": "^13.1.9",
"@types/babel__preset-env": "^7",
"@types/react": "^16.14.2",
"@types/react-dom": "^16.9.10",
"@types/react": "^16.14.23",
"@types/react-dom": "^16.9.14",
"cross-env": "^7.0.3",
"typescript": "^3.9.7",
"webpack": "4"
Expand Down
112 changes: 56 additions & 56 deletions lib/cli/src/versions.ts
View file
Original file line number Diff line number Diff line change
@@ -1,58 +1,58 @@
// auto generated file, do not edit
export default {
"@storybook/addon-a11y": "6.5.0-alpha.35",
"@storybook/addon-actions": "6.5.0-alpha.35",
"@storybook/addon-backgrounds": "6.5.0-alpha.35",
"@storybook/addon-controls": "6.5.0-alpha.35",
"@storybook/addon-docs": "6.5.0-alpha.35",
"@storybook/addon-essentials": "6.5.0-alpha.35",
"@storybook/addon-interactions": "6.5.0-alpha.35",
"@storybook/addon-jest": "6.5.0-alpha.35",
"@storybook/addon-links": "6.5.0-alpha.35",
"@storybook/addon-measure": "6.5.0-alpha.35",
"@storybook/addon-outline": "6.5.0-alpha.35",
"@storybook/addon-storyshots": "6.5.0-alpha.35",
"@storybook/addon-storyshots-puppeteer": "6.5.0-alpha.35",
"@storybook/addon-storysource": "6.5.0-alpha.35",
"@storybook/addon-toolbars": "6.5.0-alpha.35",
"@storybook/addon-viewport": "6.5.0-alpha.35",
"@storybook/addons": "6.5.0-alpha.35",
"@storybook/angular": "6.5.0-alpha.35",
"@storybook/api": "6.5.0-alpha.35",
"@storybook/builder-webpack4": "6.5.0-alpha.35",
"@storybook/builder-webpack5": "6.5.0-alpha.35",
"@storybook/channel-postmessage": "6.5.0-alpha.35",
"@storybook/channel-websocket": "6.5.0-alpha.35",
"@storybook/channels": "6.5.0-alpha.35",
"@storybook/cli": "6.5.0-alpha.35",
"@storybook/client-api": "6.5.0-alpha.35",
"@storybook/client-logger": "6.5.0-alpha.35",
"@storybook/codemod": "6.5.0-alpha.35",
"@storybook/components": "6.5.0-alpha.35",
"@storybook/core": "6.5.0-alpha.35",
"@storybook/core-client": "6.5.0-alpha.35",
"@storybook/core-common": "6.5.0-alpha.35",
"@storybook/core-events": "6.5.0-alpha.35",
"@storybook/core-server": "6.5.0-alpha.35",
"@storybook/csf-tools": "6.5.0-alpha.35",
"@storybook/ember": "6.5.0-alpha.35",
"@storybook/html": "6.5.0-alpha.35",
"@storybook/instrumenter": "6.5.0-alpha.35",
"@storybook/manager-webpack4": "6.5.0-alpha.35",
"@storybook/manager-webpack5": "6.5.0-alpha.35",
"@storybook/node-logger": "6.5.0-alpha.35",
"@storybook/postinstall": "6.5.0-alpha.35",
"@storybook/preact": "6.5.0-alpha.35",
"@storybook/preview-web": "6.5.0-alpha.35",
"@storybook/react": "6.5.0-alpha.35",
"@storybook/router": "6.5.0-alpha.35",
"@storybook/server": "6.5.0-alpha.35",
"@storybook/source-loader": "6.5.0-alpha.35",
"@storybook/store": "6.5.0-alpha.35",
"@storybook/svelte": "6.5.0-alpha.35",
"@storybook/theming": "6.5.0-alpha.35",
"@storybook/ui": "6.5.0-alpha.35",
"@storybook/vue": "6.5.0-alpha.35",
"@storybook/vue3": "6.5.0-alpha.35",
"@storybook/web-components": "6.5.0-alpha.35"
}
'@storybook/addon-a11y': '6.5.0-alpha.35',
'@storybook/addon-actions': '6.5.0-alpha.35',
'@storybook/addon-backgrounds': '6.5.0-alpha.35',
'@storybook/addon-controls': '6.5.0-alpha.35',
'@storybook/addon-docs': '6.5.0-alpha.35',
'@storybook/addon-essentials': '6.5.0-alpha.35',
'@storybook/addon-interactions': '6.5.0-alpha.35',
'@storybook/addon-jest': '6.5.0-alpha.35',
'@storybook/addon-links': '6.5.0-alpha.35',
'@storybook/addon-measure': '6.5.0-alpha.35',
'@storybook/addon-outline': '6.5.0-alpha.35',
'@storybook/addon-storyshots': '6.5.0-alpha.35',
'@storybook/addon-storyshots-puppeteer': '6.5.0-alpha.35',
'@storybook/addon-storysource': '6.5.0-alpha.35',
'@storybook/addon-toolbars': '6.5.0-alpha.35',
'@storybook/addon-viewport': '6.5.0-alpha.35',
'@storybook/addons': '6.5.0-alpha.35',
'@storybook/angular': '6.5.0-alpha.35',
'@storybook/api': '6.5.0-alpha.35',
'@storybook/builder-webpack4': '6.5.0-alpha.35',
'@storybook/builder-webpack5': '6.5.0-alpha.35',
'@storybook/channel-postmessage': '6.5.0-alpha.35',
'@storybook/channel-websocket': '6.5.0-alpha.35',
'@storybook/channels': '6.5.0-alpha.35',
'@storybook/cli': '6.5.0-alpha.35',
'@storybook/client-api': '6.5.0-alpha.35',
'@storybook/client-logger': '6.5.0-alpha.35',
'@storybook/codemod': '6.5.0-alpha.35',
'@storybook/components': '6.5.0-alpha.35',
'@storybook/core': '6.5.0-alpha.35',
'@storybook/core-client': '6.5.0-alpha.35',
'@storybook/core-common': '6.5.0-alpha.35',
'@storybook/core-events': '6.5.0-alpha.35',
'@storybook/core-server': '6.5.0-alpha.35',
'@storybook/csf-tools': '6.5.0-alpha.35',
'@storybook/ember': '6.5.0-alpha.35',
'@storybook/html': '6.5.0-alpha.35',
'@storybook/instrumenter': '6.5.0-alpha.35',
'@storybook/manager-webpack4': '6.5.0-alpha.35',
'@storybook/manager-webpack5': '6.5.0-alpha.35',
'@storybook/node-logger': '6.5.0-alpha.35',
'@storybook/postinstall': '6.5.0-alpha.35',
'@storybook/preact': '6.5.0-alpha.35',
'@storybook/preview-web': '6.5.0-alpha.35',
'@storybook/react': '6.5.0-alpha.35',
'@storybook/router': '6.5.0-alpha.35',
'@storybook/server': '6.5.0-alpha.35',
'@storybook/source-loader': '6.5.0-alpha.35',
'@storybook/store': '6.5.0-alpha.35',
'@storybook/svelte': '6.5.0-alpha.35',
'@storybook/theming': '6.5.0-alpha.35',
'@storybook/ui': '6.5.0-alpha.35',
'@storybook/vue': '6.5.0-alpha.35',
'@storybook/vue3': '6.5.0-alpha.35',
'@storybook/web-components': '6.5.0-alpha.35',
};
20 changes: 11 additions & 9 deletions lib/components/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,20 +37,25 @@
"*.d.ts"
],
"scripts": {
"prepare": "node ../../scripts/prepare.js"
"prepare": "ts-node ../../scripts/prebundle.ts"
},
"dependencies": {
"@popperjs/core": "^2.6.0",
"@storybook/client-logger": "6.5.0-alpha.35",
"@storybook/csf": "0.0.2--canary.87bc651.0",
"@storybook/theming": "6.5.0-alpha.35",
"core-js": "^3.8.2",
"regenerator-runtime": "^0.13.7"
},
"devDependencies": {
"@popperjs/core": "^2.6.0",
"@types/color-convert": "^2.0.0",
"@types/overlayscrollbars": "^1.12.0",
"@types/react-syntax-highlighter": "11.0.5",
"color-convert": "^2.0.1",
"core-js": "^3.8.2",
"css": "^3.0.0",
"fast-deep-equal": "^3.1.3",
"global": "^4.4.0",
"jest": "^26.6.3",
"lodash": "^4.17.21",
"markdown-to-jsx": "^7.1.3",
"memoizerific": "^1.11.3",
Expand All @@ -62,21 +67,18 @@
"react-popper-tooltip": "^3.1.1",
"react-syntax-highlighter": "^15.4.5",
"react-textarea-autosize": "^8.3.0",
"regenerator-runtime": "^0.13.7",
"ts-dedent": "^2.0.0",
"ts-node": "^10.4.0",
"util-deprecate": "^1.0.2"
},
"devDependencies": {
"css": "^3.0.0",
"jest": "^26.6.3"
},
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0",
"react-dom": "^16.8.0 || ^17.0.0"
},
"publishConfig": {
"access": "public"
},
"gitHead": "7a483e312a7355fc0408a578bfc16d4e476b0938",
"bundlerEntrypoint": "./src/index.ts",
"gitHead": "5eafd588972634b4d76ca2ebf01bd5ca2aaa0119",
"sbmodern": "dist/modern/index.js"
}
3 changes: 3 additions & 0 deletions lib/components/src/index.ts
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
// eslint-disable-next-line @typescript-eslint/triple-slash-reference
/// <reference path="./typings.d.ts" />

import { createElement, forwardRef, ElementType } from 'react';
import * as typography from './typography/components';

Expand Down
8 changes: 6 additions & 2 deletions lib/theming/src/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,19 @@
/// <reference path="./typings.d.ts" />

import emotionStyled, { CreateStyled } from '@emotion/styled';

import { Theme } from './types';

export type { StyledComponent } from '@emotion/styled';
export { Global, keyframes, css, jsx, ClassNames } from '@emotion/core';
export type { CSSObject, Keyframes } from '@emotion/core';

export const styled = emotionStyled as CreateStyled<Theme>;

export * from './base';
export * from './types';

export * from '@emotion/core';
export * from 'emotion-theming';
export { withTheme, useTheme, ThemeProvider } from 'emotion-theming';
export { default as isPropValid } from '@emotion/is-prop-valid';

export { createGlobal, createReset } from './global';
Expand Down
1 change: 0 additions & 1 deletion lib/ui/src/components/layout/desktop.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
/* eslint-disable import/no-extraneous-dependencies */
import React, { Fragment } from 'react';
import type { DecoratorFn } from '@storybook/react';

Expand Down
1 change: 0 additions & 1 deletion lib/ui/src/components/panel/panel.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';
import { action } from '@storybook/addon-actions';
import Panel from './panel';
Expand Down
1 change: 0 additions & 1 deletion lib/ui/src/components/preview/preview.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';

import { parsePath, createPath } from 'history';
Expand Down
1 change: 0 additions & 1 deletion lib/ui/src/components/sidebar/Heading.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
/* eslint-disable import/no-extraneous-dependencies */
/* eslint-disable storybook/use-storybook-testing-library */
// @TODO: use addon-interactions and remove the rule disable above
import React from 'react';
Expand Down
1 change: 0 additions & 1 deletion lib/ui/src/components/sidebar/Search.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';
import { action } from '@storybook/addon-actions';

Expand Down
1 change: 0 additions & 1 deletion lib/ui/src/components/sidebar/Tree.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
/* eslint-disable import/no-extraneous-dependencies */
/* eslint-disable storybook/use-storybook-testing-library */
// @TODO: use addon-interactions and remove the rule disable above
import React from 'react';
Expand Down
1 change: 0 additions & 1 deletion lib/ui/src/settings/SettingsFooter.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';

import { DecoratorFn } from '@storybook/react';
Expand Down
1 change: 0 additions & 1 deletion lib/ui/src/settings/about.stories.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';
import { storiesOf } from '@storybook/react';
import { actions as createActions } from '@storybook/addon-actions';
Expand Down
1 change: 0 additions & 1 deletion lib/ui/src/settings/release_notes.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';
import { actions as makeActions } from '@storybook/addon-actions';

Expand Down
1 change: 0 additions & 1 deletion lib/ui/src/settings/shortcuts.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';
import { actions as makeActions } from '@storybook/addon-actions';

Expand Down
5 changes: 3 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -202,8 +202,8 @@
"@types/node": "^14.14.20 || ^16.0.0",
"@types/node-cleanup": "^2.1.1",
"@types/prompts": "2.0.11",
"@types/react": "^16",
"@types/react-dom": "^16",
"@types/react": "^16.14.23",
"@types/react-dom": "^16.9.14",
"@types/semver": "^7.3.4",
"@types/serve-static": "^1.13.8",
"@types/shelljs": "^0.8.7",
Expand Down Expand Up @@ -278,6 +278,7 @@
"remark-lint": "^8.0.0",
"remark-preset-lint-recommended": "^5.0.0",
"rollup": "^2.60.2",
"rollup-plugin-extensions": "^0.1.0",
"rollup-plugin-jsx": "^1.0.3",
"rollup-plugin-terser": "^7.0.2",
"serve-static": "^1.14.1",
Expand Down
2 changes: 1 addition & 1 deletion scripts/bundle-package.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -160,7 +160,7 @@ async function dts({ input, externals, cwd, ...options }: Options) {

await dtsLozalize.run([bundledDTSfile], localizedDTSout, { externals, cwd });

await fs.remove(path.join(cwd, 'dist/ts-tmp'));
// await fs.remove(path.join(cwd, 'dist/ts-tmp'));

await execa('node', [
path.join(__dirname, '../node_modules/.bin/downlevel-dts'),
Expand Down
3 changes: 2 additions & 1 deletion scripts/dts-localize.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -235,7 +235,7 @@ export const run = async (entrySourceFiles: string[], outputPath: string, option

function getSourceFile(moduleNode: ts.Node) {
while (!ts.isSourceFile(moduleNode)) {
moduleNode = moduleNode.parent;
moduleNode = moduleNode.getSourceFile();
}
return moduleNode;
}
Expand Down Expand Up @@ -271,6 +271,7 @@ export const run = async (entrySourceFiles: string[], outputPath: string, option
// I could create the dependency graph myself, perhaps that'd be better, but I'm OK with this for now.
if (sourceFile.resolvedModules && sourceFile.resolvedModules.size > 0) {
Array.from(sourceFile.resolvedModules.entries()).forEach(([k, v]) => {
// console.log({ k }, v.resolvedFileName);
if (externals.includes(k)) {
return;
}
Expand Down
Loading

0 comments on commit 1f72bf9

Please sign in to comment.