mirror of
https://github.com/storybookjs/storybook.git
synced 2025-04-08 11:11:53 +08:00
Build "entries" with presets and inject them to the presets.extendWebpack
This commit is contained in:
parent
60176a537a
commit
d08fac0b1c
@ -8,14 +8,17 @@ function customPreset({ configDir }) {
|
|||||||
return serverRequire(path.resolve(configDir, 'presets')) || [];
|
return serverRequire(path.resolve(configDir, 'presets')) || [];
|
||||||
}
|
}
|
||||||
|
|
||||||
function getBabelConfig(options, presets) {
|
|
||||||
const { configDir, wrapDefaultBabelConfig = noopWrapper } = options;
|
|
||||||
return presets.extendBabel({}, { configDir, wrapDefaultBabelConfig });
|
|
||||||
}
|
|
||||||
|
|
||||||
function getWebpackConfig(options, presets) {
|
function getWebpackConfig(options, presets) {
|
||||||
const babelOptions = getBabelConfig(options, presets);
|
const { configDir, wrapDefaultBabelConfig = noopWrapper } = options;
|
||||||
return presets.extendWebpack({}, { ...options, babelOptions, presets });
|
|
||||||
|
const babelOptions = presets.extendBabel({}, { configDir, wrapDefaultBabelConfig });
|
||||||
|
|
||||||
|
const entries = {
|
||||||
|
iframe: presets.extendPreview([], options),
|
||||||
|
manager: presets.extendManager([], options),
|
||||||
|
};
|
||||||
|
|
||||||
|
return presets.extendWebpack({}, { ...options, babelOptions, entries });
|
||||||
}
|
}
|
||||||
|
|
||||||
export default options => {
|
export default options => {
|
||||||
|
@ -2,9 +2,8 @@ import path from 'path';
|
|||||||
import { logger } from '@storybook/node-logger';
|
import { logger } from '@storybook/node-logger';
|
||||||
import { getInterpretedFile } from './interpret-files';
|
import { getInterpretedFile } from './interpret-files';
|
||||||
|
|
||||||
export default function getEntries(configDir, presets) {
|
export function createPreviewEntry({ configDir }) {
|
||||||
const iframe = [require.resolve('./polyfills'), require.resolve('./globals')];
|
const iframe = [require.resolve('./polyfills'), require.resolve('./globals')];
|
||||||
const manager = [require.resolve('./polyfills'), require.resolve('../../client/manager')];
|
|
||||||
|
|
||||||
// Check whether a config.{ext} file exists inside the storybook
|
// Check whether a config.{ext} file exists inside the storybook
|
||||||
// config directory and throw an error if it's not.
|
// config directory and throw an error if it's not.
|
||||||
@ -15,6 +14,12 @@ export default function getEntries(configDir, presets) {
|
|||||||
|
|
||||||
iframe.push(require.resolve(storybookConfigPath));
|
iframe.push(require.resolve(storybookConfigPath));
|
||||||
|
|
||||||
|
return iframe;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function createManagerEntry({ configDir }) {
|
||||||
|
const manager = [require.resolve('./polyfills'), require.resolve('../../client/manager')];
|
||||||
|
|
||||||
// Check whether addons.{ext} file exists inside the storybook.
|
// Check whether addons.{ext} file exists inside the storybook.
|
||||||
const storybookCustomAddonsPath = getInterpretedFile(path.resolve(configDir, 'addons'));
|
const storybookCustomAddonsPath = getInterpretedFile(path.resolve(configDir, 'addons'));
|
||||||
if (storybookCustomAddonsPath) {
|
if (storybookCustomAddonsPath) {
|
||||||
@ -22,8 +27,5 @@ export default function getEntries(configDir, presets) {
|
|||||||
manager.unshift(storybookCustomAddonsPath);
|
manager.unshift(storybookCustomAddonsPath);
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return manager;
|
||||||
iframe: presets.extendPreview(iframe),
|
|
||||||
manager: presets.extendManager(manager),
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
@ -5,14 +5,11 @@ import Dotenv from 'dotenv-webpack';
|
|||||||
import WatchMissingNodeModulesPlugin from 'react-dev-utils/WatchMissingNodeModulesPlugin';
|
import WatchMissingNodeModulesPlugin from 'react-dev-utils/WatchMissingNodeModulesPlugin';
|
||||||
import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin';
|
import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin';
|
||||||
import GeneratePagePlugin from 'generate-page-webpack-plugin';
|
import GeneratePagePlugin from 'generate-page-webpack-plugin';
|
||||||
import getEntries from './entries';
|
|
||||||
import { includePaths, excludePaths, nodeModulesPaths, loadEnv, nodePaths } from './utils';
|
import { includePaths, excludePaths, nodeModulesPaths, loadEnv, nodePaths } from './utils';
|
||||||
import { getPreviewHeadHtml, getManagerHeadHtml, getPreviewBodyHtml } from '../utils';
|
import { getPreviewHeadHtml, getManagerHeadHtml, getPreviewBodyHtml } from '../utils';
|
||||||
import { version } from '../../../package.json';
|
import { version } from '../../../package.json';
|
||||||
|
|
||||||
export default ({ configDir, quiet, babelOptions, presets }) => {
|
export default ({ configDir, quiet, babelOptions, entries }) => {
|
||||||
const entries = getEntries(configDir, presets);
|
|
||||||
|
|
||||||
const entriesMeta = {
|
const entriesMeta = {
|
||||||
iframe: {
|
iframe: {
|
||||||
headHtmlSnippet: getPreviewHeadHtml(configDir, process.env),
|
headHtmlSnippet: getPreviewHeadHtml(configDir, process.env),
|
||||||
@ -26,13 +23,7 @@ export default ({ configDir, quiet, babelOptions, presets }) => {
|
|||||||
return {
|
return {
|
||||||
mode: 'development',
|
mode: 'development',
|
||||||
devtool: 'cheap-module-source-map',
|
devtool: 'cheap-module-source-map',
|
||||||
entry: {
|
entry: entries,
|
||||||
...entries,
|
|
||||||
iframe: [
|
|
||||||
...entries.iframe,
|
|
||||||
`${require.resolve('webpack-hot-middleware/client')}?reload=true`,
|
|
||||||
],
|
|
||||||
},
|
|
||||||
output: {
|
output: {
|
||||||
path: path.join(__dirname, 'dist'),
|
path: path.join(__dirname, 'dist'),
|
||||||
filename: 'static/[name].bundle.js',
|
filename: 'static/[name].bundle.js',
|
||||||
|
@ -2,14 +2,11 @@ import webpack from 'webpack';
|
|||||||
import { getEnvironment } from 'universal-dotenv';
|
import { getEnvironment } from 'universal-dotenv';
|
||||||
import Dotenv from 'dotenv-webpack';
|
import Dotenv from 'dotenv-webpack';
|
||||||
import GeneratePagePlugin from 'generate-page-webpack-plugin';
|
import GeneratePagePlugin from 'generate-page-webpack-plugin';
|
||||||
import getEntries from './entries';
|
|
||||||
import { version } from '../../../package.json';
|
import { version } from '../../../package.json';
|
||||||
import { includePaths, excludePaths, loadEnv, nodePaths } from './utils';
|
import { includePaths, excludePaths, loadEnv, nodePaths } from './utils';
|
||||||
import { getPreviewHeadHtml, getManagerHeadHtml, getPreviewBodyHtml } from '../utils';
|
import { getPreviewHeadHtml, getManagerHeadHtml, getPreviewBodyHtml } from '../utils';
|
||||||
|
|
||||||
export default ({ configDir, babelOptions, presets }) => {
|
export default ({ configDir, babelOptions, entries }) => {
|
||||||
const entries = getEntries(configDir, presets);
|
|
||||||
|
|
||||||
const entriesMeta = {
|
const entriesMeta = {
|
||||||
iframe: {
|
iframe: {
|
||||||
headHtmlSnippet: getPreviewHeadHtml(configDir, process.env),
|
headHtmlSnippet: getPreviewHeadHtml(configDir, process.env),
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
import loadCustomBabelConfig from './loadCustomBabelConfig';
|
import loadCustomBabelConfig from './loadCustomBabelConfig';
|
||||||
import createDevConfig from './config/webpack.config';
|
import createDevConfig from './config/webpack.config';
|
||||||
import defaultBabelConfig from './config/babel';
|
import defaultBabelConfig from './config/babel';
|
||||||
|
import { createManagerEntry, createPreviewEntry } from './config/entries';
|
||||||
|
|
||||||
function extendWebpack(_, options) {
|
function extendWebpack(_, options) {
|
||||||
return createDevConfig(options);
|
return createDevConfig(options);
|
||||||
@ -10,7 +11,20 @@ function extendBabel(_, { configDir, wrapDefaultBabelConfig }) {
|
|||||||
return loadCustomBabelConfig(configDir) || wrapDefaultBabelConfig(defaultBabelConfig);
|
return loadCustomBabelConfig(configDir) || wrapDefaultBabelConfig(defaultBabelConfig);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function extendManager(_, options) {
|
||||||
|
return createManagerEntry(options);
|
||||||
|
}
|
||||||
|
|
||||||
|
function extendPreview(_, options) {
|
||||||
|
return [
|
||||||
|
...createPreviewEntry(options),
|
||||||
|
`${require.resolve('webpack-hot-middleware/client')}?reload=true`,
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
extendWebpack,
|
extendWebpack,
|
||||||
extendBabel,
|
extendBabel,
|
||||||
|
extendManager,
|
||||||
|
extendPreview,
|
||||||
};
|
};
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
import loadCustomBabelConfig from './loadCustomBabelConfig';
|
import loadCustomBabelConfig from './loadCustomBabelConfig';
|
||||||
import createProdConfig from './config/webpack.config.prod';
|
import createProdConfig from './config/webpack.config.prod';
|
||||||
import defaultBabelConfig from './config/babel.prod';
|
import defaultBabelConfig from './config/babel.prod';
|
||||||
|
import { createManagerEntry, createPreviewEntry } from './config/entries';
|
||||||
|
|
||||||
function extendWebpack(_, options) {
|
function extendWebpack(_, options) {
|
||||||
return createProdConfig(options);
|
return createProdConfig(options);
|
||||||
@ -10,7 +11,17 @@ function extendBabel(_, { configDir, wrapDefaultBabelConfig }) {
|
|||||||
return loadCustomBabelConfig(configDir) || wrapDefaultBabelConfig(defaultBabelConfig);
|
return loadCustomBabelConfig(configDir) || wrapDefaultBabelConfig(defaultBabelConfig);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function extendManager(_, options) {
|
||||||
|
return createManagerEntry(options);
|
||||||
|
}
|
||||||
|
|
||||||
|
function extendPreview(_, options) {
|
||||||
|
return createPreviewEntry(options);
|
||||||
|
}
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
extendWebpack,
|
extendWebpack,
|
||||||
extendBabel,
|
extendBabel,
|
||||||
|
extendManager,
|
||||||
|
extendPreview,
|
||||||
};
|
};
|
||||||
|
Loading…
x
Reference in New Issue
Block a user