@storybook/builder-webpack5 7.0.0-alpha.1 → 7.0.0-alpha.2

package/dist/cjs/preview/babel-loader-preview.js

@@ -3,27 +3,16 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useBaseTsSupport = exports.createBabelLoader = void 0;
+exports.createBabelLoader = void 0;
 
 var _coreCommon = require("@storybook/core-common");
 
-/**
- * Returns true if the framework can use the base TS config.
- * @param {string} framework
- */
-var useBaseTsSupport = function (framework) {
-  // These packages both have their own TS implementation.
-  return !['@storybook/vue', '@storybook/angular'].includes(framework);
-};
-
-exports.useBaseTsSupport = useBaseTsSupport;
-
-var createBabelLoader = function (options, framework) {
+var createBabelLoader = function (options, typescriptOptions) {
   return {
-    test: useBaseTsSupport(framework) ? /\.(mjs|tsx?|jsx?)$/ : /\.(mjs|jsx?)$/,
+    test: typescriptOptions.skipBabel ? /\.(mjs|jsx?)$/ : /\.(mjs|tsx?|jsx?)$/,
     use: [{
-      loader: require.resolve('babel-loader') // options,
-
+      loader: require.resolve('babel-loader'),
+      options: options
     }],
     include: [(0, _coreCommon.getProjectRoot)()],
     exclude: /node_modules/

package/dist/cjs/preview/iframe-webpack.config.js

@@ -27,8 +27,6 @@ var _coreCommon = require("@storybook/core-common");
 
 var _babelLoaderPreview = require("./babel-loader-preview");
 
-var _useBaseTsSupport = require("./useBaseTsSupport");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -37,21 +35,23 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-var storybookPaths = ['addons', 'api', 'channels', 'channel-postmessage', 'components', 'core-events', 'router', 'theming', 'semver', 'client-api', 'client-logger'].reduce(function (acc, sbPackage) {
+var storybookPaths = _objectSpread({
+  global: _path.default.dirname(require.resolve(`global/package.json`))
+}, ['addons', 'api', 'store', 'channels', 'channel-postmessage', 'channel-websocket', 'components', 'core-events', 'router', 'theming', 'semver', 'preview-web', 'client-api', 'client-logger'].reduce(function (acc, sbPackage) {
   return _objectSpread(_objectSpread({}, acc), {}, {
     [`@storybook/${sbPackage}`]: _path.default.dirname(require.resolve(`@storybook/${sbPackage}/package.json`))
   });
-}, {});
+}, {}));
 
 var _default = async function _default(options) {
-  var babelOptions = options.babelOptions,
-      _options$outputDir = options.outputDir,
+  var _options$outputDir = options.outputDir,
       outputDir = _options$outputDir === void 0 ? _path.default.join('.', 'public') : _options$outputDir,
       quiet = options.quiet,
       packageJson = options.packageJson,
       configType = options.configType,
       presets = options.presets,
       previewUrl = options.previewUrl,
+      babelOptions = options.babelOptions,
       typescriptOptions = options.typescriptOptions,
       features = options.features,
       serverChannelUrl = options.serverChannelUrl;
@@ -72,16 +72,13 @@ var _default = async function _default(options) {
       frameworkName = _ref.name,
       frameworkOptions = _ref.options;
 
+  var isProd = configType === 'PRODUCTION';
   var envs = await presets.apply('env');
-  var logLevel = await presets.apply('logLevel', undefined); // FIXME: migrate away from frameworkOptions
-  // const frameworkOptions = await presets.apply(`${framework}Options`, {});
-
+  var logLevel = await presets.apply('logLevel', undefined);
   var headHtmlSnippet = await presets.apply('previewHead');
   var bodyHtmlSnippet = await presets.apply('previewBody');
   var template = await presets.apply('previewMainTemplate');
   var coreOptions = await presets.apply('core');
-  var babelLoader = (0, _babelLoaderPreview.createBabelLoader)(babelOptions, frameworkName);
-  var isProd = configType === 'PRODUCTION';
   var configs = [...(await presets.apply('config', [], options)), (0, _coreCommon.loadPreviewOrConfigFile)(options)].filter(Boolean);
   var entries = await presets.apply('entries', [], options);
   var workingDir = process.cwd();
@@ -140,7 +137,7 @@ var _default = async function _default(options) {
     }
   }
 
-  var shouldCheckTs = (0, _useBaseTsSupport.useBaseTsSupport)(frameworkName) && typescriptOptions.check;
+  var shouldCheckTs = typescriptOptions.check && !typescriptOptions.skipBabel;
   var tsCheckOptions = typescriptOptions.checkOptions || {};
   return {
     name: 'preview',
@@ -203,7 +200,7 @@ var _default = async function _default(options) {
       process: require.resolve('process/browser.js')
     }), isProd ? null : new _webpack.HotModuleReplacementPlugin(), new _caseSensitivePathsWebpackPlugin.default(), quiet ? null : new _webpack.ProgressPlugin({}), shouldCheckTs ? new _forkTsCheckerWebpackPlugin.default(tsCheckOptions) : null].filter(Boolean),
     module: {
-      rules: [babelLoader, {
+      rules: [(0, _babelLoaderPreview.createBabelLoader)(babelOptions, typescriptOptions), {
         test: /\.md$/,
         type: 'asset/source'
       }]
@@ -233,9 +230,7 @@ var _default = async function _default(options) {
           sourceMap: true,
           mangle: false,
           keep_fnames: true
-        } // It looks like the types from `@types/terser-webpack-plugin` are not matching the latest version of
-        // Webpack yet
-
+        }
       })] : []
     },
     performance: {

package/dist/esm/preview/babel-loader-preview.js

@@ -1,19 +1,10 @@
 import { getProjectRoot } from '@storybook/core-common';
-/**
- * Returns true if the framework can use the base TS config.
- * @param {string} framework
- */
-
-export var useBaseTsSupport = function (framework) {
-  // These packages both have their own TS implementation.
-  return !['@storybook/vue', '@storybook/angular'].includes(framework);
-};
-export var createBabelLoader = function (options, framework) {
+export var createBabelLoader = function (options, typescriptOptions) {
   return {
-    test: useBaseTsSupport(framework) ? /\.(mjs|tsx?|jsx?)$/ : /\.(mjs|jsx?)$/,
+    test: typescriptOptions.skipBabel ? /\.(mjs|jsx?)$/ : /\.(mjs|tsx?|jsx?)$/,
     use: [{
-      loader: require.resolve('babel-loader') // options,
-
+      loader: require.resolve('babel-loader'),
+      options: options
     }],
     include: [getProjectRoot()],
     exclude: /node_modules/

package/dist/esm/preview/iframe-webpack.config.js

@@ -17,21 +17,24 @@ import VirtualModulePlugin from 'webpack-virtual-modules';
 import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
 import { toRequireContextString, stringifyProcessEnvs, handlebars, interpolate, toImportFn, normalizeStories, readTemplate, loadPreviewOrConfigFile } from '@storybook/core-common';
 import { createBabelLoader } from './babel-loader-preview';
-import { useBaseTsSupport } from './useBaseTsSupport';
-var storybookPaths = ['addons', 'api', 'channels', 'channel-postmessage', 'components', 'core-events', 'router', 'theming', 'semver', 'client-api', 'client-logger'].reduce(function (acc, sbPackage) {
+
+var storybookPaths = _objectSpread({
+  global: path.dirname(require.resolve(`global/package.json`))
+}, ['addons', 'api', 'store', 'channels', 'channel-postmessage', 'channel-websocket', 'components', 'core-events', 'router', 'theming', 'semver', 'preview-web', 'client-api', 'client-logger'].reduce(function (acc, sbPackage) {
   return _objectSpread(_objectSpread({}, acc), {}, {
     [`@storybook/${sbPackage}`]: path.dirname(require.resolve(`@storybook/${sbPackage}/package.json`))
   });
-}, {});
+}, {}));
+
 export default (async function (options) {
-  var babelOptions = options.babelOptions,
-      _options$outputDir = options.outputDir,
+  var _options$outputDir = options.outputDir,
       outputDir = _options$outputDir === void 0 ? path.join('.', 'public') : _options$outputDir,
       quiet = options.quiet,
       packageJson = options.packageJson,
       configType = options.configType,
       presets = options.presets,
       previewUrl = options.previewUrl,
+      babelOptions = options.babelOptions,
       typescriptOptions = options.typescriptOptions,
       features = options.features,
       serverChannelUrl = options.serverChannelUrl;
@@ -52,16 +55,13 @@ export default (async function (options) {
       frameworkName = _ref.name,
       frameworkOptions = _ref.options;
 
+  var isProd = configType === 'PRODUCTION';
   var envs = await presets.apply('env');
-  var logLevel = await presets.apply('logLevel', undefined); // FIXME: migrate away from frameworkOptions
-  // const frameworkOptions = await presets.apply(`${framework}Options`, {});
-
+  var logLevel = await presets.apply('logLevel', undefined);
   var headHtmlSnippet = await presets.apply('previewHead');
   var bodyHtmlSnippet = await presets.apply('previewBody');
   var template = await presets.apply('previewMainTemplate');
   var coreOptions = await presets.apply('core');
-  var babelLoader = createBabelLoader(babelOptions, frameworkName);
-  var isProd = configType === 'PRODUCTION';
   var configs = [...(await presets.apply('config', [], options)), loadPreviewOrConfigFile(options)].filter(Boolean);
   var entries = await presets.apply('entries', [], options);
   var workingDir = process.cwd();
@@ -115,7 +115,7 @@ export default (async function (options) {
     }
   }
 
-  var shouldCheckTs = useBaseTsSupport(frameworkName) && typescriptOptions.check;
+  var shouldCheckTs = typescriptOptions.check && !typescriptOptions.skipBabel;
   var tsCheckOptions = typescriptOptions.checkOptions || {};
   return {
     name: 'preview',
@@ -178,7 +178,7 @@ export default (async function (options) {
       process: require.resolve('process/browser.js')
     }), isProd ? null : new HotModuleReplacementPlugin(), new CaseSensitivePathsPlugin(), quiet ? null : new ProgressPlugin({}), shouldCheckTs ? new ForkTsCheckerWebpackPlugin(tsCheckOptions) : null].filter(Boolean),
     module: {
-      rules: [babelLoader, {
+      rules: [createBabelLoader(babelOptions, typescriptOptions), {
         test: /\.md$/,
         type: 'asset/source'
       }]
@@ -208,9 +208,7 @@ export default (async function (options) {
           sourceMap: true,
           mangle: false,
           keep_fnames: true
-        } // It looks like the types from `@types/terser-webpack-plugin` are not matching the latest version of
-        // Webpack yet
-
+        }
       })] : []
     },
     performance: {

package/dist/types/preview/babel-loader-preview.d.ts

@@ -1,12 +1,9 @@
-/**
- * Returns true if the framework can use the base TS config.
- * @param {string} framework
- */
-export declare const useBaseTsSupport: (framework: string) => boolean;
-export declare const createBabelLoader: (options: any, framework: string) => {
+import { TypescriptOptions } from '../types';
+export declare const createBabelLoader: (options: any, typescriptOptions: TypescriptOptions) => {
     test: RegExp;
     use: {
         loader: string;
+        options: any;
     }[];
     include: string[];
     exclude: RegExp;

package/dist/types/preview/iframe-webpack.config.d.ts

@@ -1,4 +1,7 @@
 import type { Configuration } from 'webpack';
 import type { Options } from '@storybook/core-common';
-declare const _default: (options: Options & Record<string, any>) => Promise<Configuration>;
+import type { TypescriptOptions } from '../types';
+declare const _default: (options: Options & Record<string, any> & {
+    typescriptOptions: TypescriptOptions;
+}) => Promise<Configuration>;
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/builder-webpack5",
-  "version": "7.0.0-alpha.1",
+  "version": "7.0.0-alpha.2",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -33,22 +33,23 @@
   },
   "dependencies": {
     "@babel/core": "^7.12.10",
-    "@storybook/addons": "7.0.0-alpha.1",
-    "@storybook/api": "7.0.0-alpha.1",
-    "@storybook/channel-postmessage": "7.0.0-alpha.1",
-    "@storybook/channels": "7.0.0-alpha.1",
-    "@storybook/client-api": "7.0.0-alpha.1",
-    "@storybook/client-logger": "7.0.0-alpha.1",
-    "@storybook/components": "7.0.0-alpha.1",
-    "@storybook/core-common": "7.0.0-alpha.1",
-    "@storybook/core-events": "7.0.0-alpha.1",
-    "@storybook/core-webpack": "7.0.0-alpha.1",
-    "@storybook/node-logger": "7.0.0-alpha.1",
-    "@storybook/preview-web": "7.0.0-alpha.1",
-    "@storybook/router": "7.0.0-alpha.1",
+    "@storybook/addons": "7.0.0-alpha.2",
+    "@storybook/api": "7.0.0-alpha.2",
+    "@storybook/channel-postmessage": "7.0.0-alpha.2",
+    "@storybook/channel-websocket": "7.0.0-alpha.2",
+    "@storybook/channels": "7.0.0-alpha.2",
+    "@storybook/client-api": "7.0.0-alpha.2",
+    "@storybook/client-logger": "7.0.0-alpha.2",
+    "@storybook/components": "7.0.0-alpha.2",
+    "@storybook/core-common": "7.0.0-alpha.2",
+    "@storybook/core-events": "7.0.0-alpha.2",
+    "@storybook/core-webpack": "7.0.0-alpha.2",
+    "@storybook/node-logger": "7.0.0-alpha.2",
+    "@storybook/preview-web": "7.0.0-alpha.2",
+    "@storybook/router": "7.0.0-alpha.2",
     "@storybook/semver": "^7.3.2",
-    "@storybook/store": "7.0.0-alpha.1",
-    "@storybook/theming": "7.0.0-alpha.1",
+    "@storybook/store": "7.0.0-alpha.2",
+    "@storybook/theming": "7.0.0-alpha.2",
     "@types/node": "^14.0.10 || ^16.0.0",
     "babel-loader": "^8.2.5",
     "babel-plugin-named-exports-order": "^0.0.2",
@@ -59,6 +60,7 @@
     "fork-ts-checker-webpack-plugin": "^7.2.8",
     "glob": "^7.1.6",
     "glob-promise": "^3.4.0",
+    "global": "^4.4.0",
     "html-webpack-plugin": "^5.5.0",
     "path-browserify": "^1.0.1",
     "process": "^0.11.10",
@@ -91,5 +93,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "b90b85210f66da59656c2ef58b0910b156256bea"
+  "gitHead": "44920e2b6bd51981bac5124743c29fb9f5517e44"
 }

package/dist/cjs/preview/useBaseTsSupport.js

@@ -1,17 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useBaseTsSupport = void 0;
-
-/**
- * Returns true if the framework can use the base TS config.
- * @param {string} framework
- */
-var useBaseTsSupport = function (framework) {
-  // These packages both have their own TS implementation.
-  return !['@storybook/vue', '@storybook/angular'].includes(framework);
-};
-
-exports.useBaseTsSupport = useBaseTsSupport;

package/dist/esm/preview/useBaseTsSupport.js

@@ -1,8 +0,0 @@
-/**
- * Returns true if the framework can use the base TS config.
- * @param {string} framework
- */
-export var useBaseTsSupport = function (framework) {
-  // These packages both have their own TS implementation.
-  return !['@storybook/vue', '@storybook/angular'].includes(framework);
-};

package/dist/types/preview/useBaseTsSupport.d.ts

@@ -1,5 +0,0 @@
-/**
- * Returns true if the framework can use the base TS config.
- * @param {string} framework
- */
-export declare const useBaseTsSupport: (framework: string) => boolean;