@storybook/cli 7.0.0-alpha.31 → 7.0.0-alpha.33

package/dist/cjs/automigrate/fixes/index.js

@@ -1,45 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _exportNames = {
-  fixes: true
-};
-exports.fixes = void 0;
-
-var _cra = require("./cra5");
-
-var _webpack = require("./webpack5");
-
-var _angular = require("./angular12");
-
-var _vue = require("./vue3");
-
-var _mainjsFramework = require("./mainjsFramework");
-
-var _eslintPlugin = require("./eslint-plugin");
-
-var _builderVite = require("./builder-vite");
-
-var _npm = require("./npm7");
-
-var _sbScripts = require("./sb-scripts");
-
-var _newFrameworks = require("./new-frameworks");
-
-var _types = require("../types");
-
-Object.keys(_types).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _types[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _types[key];
-    }
-  });
-});
-const fixes = [_cra.cra5, _webpack.webpack5, _angular.angular12, _vue.vue3, _mainjsFramework.mainjsFramework, _eslintPlugin.eslintPlugin, _builderVite.builderVite, _npm.npm7, _sbScripts.sbScripts, _newFrameworks.newFrameworks];
-exports.fixes = fixes;

package/dist/cjs/automigrate/fixes/mainjsFramework.js

@@ -1,94 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.mainjsFramework = void 0;
-
-var _chalk = _interopRequireDefault(require("chalk"));
-
-var _tsDedent = require("ts-dedent");
-
-var _semver = _interopRequireDefault(require("@storybook/semver"));
-
-var _csfTools = require("@storybook/csf-tools");
-
-var _coreCommon = require("@storybook/core-common");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-const logger = console;
-const mainjsFramework = {
-  id: 'mainjsFramework',
-
-  async check({
-    packageManager
-  }) {
-    var _semver$coerce;
-
-    const packageJson = packageManager.retrievePackageJson(); // FIXME: use renderer in SB7?
-
-    const {
-      mainConfig,
-      framework,
-      version: storybookVersion
-    } = (0, _coreCommon.getStorybookInfo)(packageJson);
-
-    if (!mainConfig) {
-      logger.warn('Unable to find storybook main.js config, skipping');
-      return null;
-    }
-
-    const storybookCoerced = storybookVersion && ((_semver$coerce = _semver.default.coerce(storybookVersion)) === null || _semver$coerce === void 0 ? void 0 : _semver$coerce.version);
-
-    if (!storybookCoerced) {
-      logger.warn((0, _tsDedent.dedent)`
-        ❌ Unable to determine storybook version, skipping ${_chalk.default.cyan('mainjsFramework')} fix.
-        🤔 Are you running automigrate from your project directory?
-      `);
-      return null;
-    }
-
-    const main = await (0, _csfTools.readConfig)(mainConfig);
-    const currentFramework = main.getFieldValue(['framework']);
-    const features = main.getFieldValue(['features']);
-    if (currentFramework) return null;
-    return features !== null && features !== void 0 && features.breakingChangesV7 || features !== null && features !== void 0 && features.storyStoreV7 || _semver.default.gte(storybookCoerced, '7.0.0') ? {
-      main,
-      framework: `@storybook/${framework}`
-    } : null;
-  },
-
-  prompt({
-    framework
-  }) {
-    const frameworkFormatted = _chalk.default.cyan(`framework: '${framework}'`);
-
-    return (0, _tsDedent.dedent)`
-      We've detected that your main.js configuration file does not specify the
-      'framework' field, which is a requirement in SB7.0 and above. We can add one
-      for you automatically:
-
-      ${frameworkFormatted}
-
-      More info: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#mainjs-framework-field')}
-    `;
-  },
-
-  async run({
-    result: {
-      main,
-      framework
-    },
-    dryRun
-  }) {
-    logger.info(`✅ Setting 'framework' to '${framework}' in main.js`);
-
-    if (!dryRun) {
-      main.setFieldValue(['framework'], framework);
-      await (0, _csfTools.writeConfig)(main);
-    }
-  }
-
-};
-exports.mainjsFramework = mainjsFramework;

package/dist/cjs/automigrate/fixes/new-frameworks.js

@@ -1,258 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.newFrameworks = exports.getFrameworkOptions = exports.getBuilder = void 0;
-
-var _chalk = _interopRequireDefault(require("chalk"));
-
-var _tsDedent = _interopRequireDefault(require("ts-dedent"));
-
-var _semver = _interopRequireDefault(require("@storybook/semver"));
-
-var _csfTools = require("@storybook/csf-tools");
-
-var _coreCommon = require("@storybook/core-common");
-
-var _helpers = require("../../helpers");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-const logger = console;
-const packagesMap = {
-  '@storybook/react': {
-    webpack5: '@storybook/react-webpack5',
-    vite: '@storybook/react-vite'
-  },
-  '@storybook/preact': {
-    webpack5: '@storybook/preact-webpack5'
-  },
-  '@storybook/server': {
-    webpack5: '@storybook/server-webpack5'
-  },
-  '@storybook/angular': {
-    webpack5: '@storybook/angular'
-  },
-  '@storybook/vue': {
-    webpack5: '@storybook/vue-webpack5' // TODO: bring this back if we ever want to support vue 2 + vite. Else delete this!
-    // vite: '@storybook/vue-vite',
-
-  },
-  '@storybook/vue3': {
-    webpack5: '@storybook/vue3-webpack5',
-    vite: '@storybook/vue3-vite'
-  },
-  '@storybook/svelte': {
-    webpack5: '@storybook/svelte-webpack5',
-    // TODO: bring this back once we have the svelte-vite package
-    vite: '@storybook/svelte-vite'
-  },
-  '@storybook/web-components': {
-    webpack5: '@storybook/web-components-webpack5'
-  },
-  '@storybook/html': {
-    webpack5: '@storybook/html-webpack5'
-  }
-};
-
-const getBuilder = builder => {
-  if (typeof builder === 'string') {
-    return builder.includes('vite') ? 'vite' : 'webpack5';
-  }
-
-  return builder !== null && builder !== void 0 && builder.name.includes('vite') ? 'vite' : 'webpack5';
-};
-
-exports.getBuilder = getBuilder;
-
-const getFrameworkOptions = (framework, main) => {
-  const frameworkOptions = main.getFieldValue([`${framework}Options`]);
-  return frameworkOptions || {};
-};
-/**
- * Does the user have separate framework and builders (e.g. @storybook/react + core.builder -> webpack5?
- *
- * If so:
- * - Remove the dependencies (@storybook/react + @storybook/builder-webpack5 + @storybook/manager-webpack5)
- * - Install the correct new package e.g. (@storybook/react-webpack5)
- * - Update the main config to use the new framework
- * -- moving core.builder into framework.options.builder
- * -- moving frameworkOptions (e.g. reactOptions) into framework.options
- */
-
-
-exports.getFrameworkOptions = getFrameworkOptions;
-const newFrameworks = {
-  id: 'newFrameworks',
-
-  async check({
-    packageManager
-  }) {
-    var _semver$coerce;
-
-    const packageJson = packageManager.retrievePackageJson();
-    const allDeps = Object.assign({}, packageJson.dependencies, packageJson.devDependencies); // FIXME: update to use renderer instead of framework
-
-    const {
-      mainConfig,
-      version: storybookVersion,
-      framework
-    } = (0, _coreCommon.getStorybookInfo)(packageJson);
-
-    if (!mainConfig) {
-      logger.warn('Unable to find storybook main.js config, skipping');
-      return null;
-    }
-
-    const storybookCoerced = storybookVersion && ((_semver$coerce = _semver.default.coerce(storybookVersion)) === null || _semver$coerce === void 0 ? void 0 : _semver$coerce.version);
-
-    if (!storybookCoerced) {
-      logger.warn((0, _tsDedent.default)`
-        ❌ Unable to determine storybook version, skipping ${_chalk.default.cyan('newFrameworks')} fix.
-        🤔 Are you running automigrate from your project directory?
-      `);
-      return null;
-    }
-
-    if (!_semver.default.gte(storybookCoerced, '7.0.0')) {
-      return null;
-    } // If in the future the eslint plugin has a framework option, using main to extract the framework field will be very useful
-
-
-    const main = await (0, _csfTools.readConfig)(mainConfig);
-    const frameworkPackage = main.getFieldValue(['framework']);
-    const builder = main.getFieldValue(['core', 'builder']);
-
-    if (!frameworkPackage) {
-      return null;
-    }
-
-    const supportedPackages = Object.keys(packagesMap);
-
-    if (!supportedPackages.includes(frameworkPackage)) {
-      return null;
-    }
-
-    const builderInfo = {
-      name: getBuilder(builder),
-      options: main.getFieldValue(['core', 'builder', 'options']) || {}
-    };
-    const newFrameworkPackage = packagesMap[frameworkPackage][builderInfo.name]; // not all frameworks support vite yet e.g. Svelte
-
-    if (!newFrameworkPackage) {
-      return null;
-    }
-
-    if (allDeps.vite && _semver.default.lt(_semver.default.coerce(allDeps.vite).version, '3.0.0')) {
-      logger.warn((0, _tsDedent.default)`
-        ❌ Detected Vite ${allDeps.vite}, which is unsupported in Storybook 7.0, so the ${_chalk.default.cyan('newFrameworks')} fix will be skipped.
-      Please upgrade vite to 3.0.0 or higher and rerun this automigration with "npx storybook@future automigrate".
-      `);
-      return null;
-    }
-
-    const frameworkOptions = getFrameworkOptions(framework, main);
-    const dependenciesToRemove = ['@storybook/builder-webpack5', '@storybook/manager-webpack5', '@storybook/builder-webpack4', '@storybook/manager-webpack4', '@storybook/builder-vite', 'storybook-builder-vite'].filter(dep => allDeps[dep]);
-    const dependenciesToAdd = []; // some frameworks didn't change e.g. Angular, Ember
-
-    if (newFrameworkPackage !== frameworkPackage) {
-      dependenciesToRemove.push(frameworkPackage);
-      dependenciesToAdd.push(newFrameworkPackage);
-    }
-
-    return {
-      main,
-      dependenciesToAdd,
-      dependenciesToRemove,
-      frameworkPackage: newFrameworkPackage,
-      frameworkOptions,
-      builderInfo,
-      packageJson
-    };
-  },
-
-  prompt() {
-    return (0, _tsDedent.default)`
-      We've detected you are using an older format of Storybook frameworks and builders.
-
-      In Storybook 7, frameworks also specify the builder to be used.
-
-      We can remove the dependencies that are no longer needed and install the new framework that already includes the builder.
-
-      To learn more about the framework field, see: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#framework-field-mandatory')}
-
-      ${_chalk.default.underline(_chalk.default.bold(_chalk.default.cyan('Webpack4 users')))}
-
-      Unless you're using Storybook's Vite builder, this automigration will install a Webpack5-based framework.
-      
-      If you were using Storybook's Webpack4 builder (default in 6.x, discontinued in 7.0), this could be a breaking
-      change--especially if your project has a custom webpack configuration.
-      
-      To learn more about migrating from Webpack4, see: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#webpack4-support-discontinued')}
-    `;
-  },
-
-  async run({
-    result: {
-      dependenciesToAdd,
-      dependenciesToRemove,
-      main,
-      frameworkPackage,
-      frameworkOptions,
-      builderInfo,
-      packageJson
-    },
-    packageManager,
-    dryRun
-  }) {
-    logger.info(`✅ Removing legacy dependencies: ${dependenciesToRemove.join(', ')}`);
-
-    if (!dryRun) {
-      packageManager.removeDependencies({
-        skipInstall: dependenciesToAdd.length > 0,
-        packageJson
-      }, dependenciesToRemove);
-    }
-
-    if (dependenciesToAdd.length > 0) {
-      logger.info(`✅ Installing new dependencies: ${dependenciesToAdd.join(', ')}`);
-
-      if (!dryRun) {
-        const versionToInstall = (0, _helpers.getStorybookVersionSpecifier)(packageJson);
-        const depsToAdd = dependenciesToAdd.map(dep => `${dep}@${versionToInstall}`);
-        packageManager.addDependencies({
-          installAsDevDependencies: true
-        }, depsToAdd);
-      }
-    }
-
-    if (!dryRun) {
-      logger.info(`✅ Updating framework field in main.js`);
-      const currentCore = main.getFieldValue(['core']);
-      main.setFieldValue(['framework', 'name'], frameworkPackage);
-      main.setFieldValue(['framework', 'options'], frameworkOptions);
-
-      if (currentCore !== null && currentCore !== void 0 && currentCore.builder) {
-        delete currentCore.builder;
-      }
-
-      if (Object.keys(builderInfo.options).length > 0) {
-        main.setFieldValue(['framework', 'options', 'builder'], builderInfo.options);
-      }
-
-      if (currentCore) {
-        if (Object.keys(currentCore).length === 0) {
-          // TODO: this should delete the field instead
-          main.setFieldValue(['core'], {});
-        } else {
-          main.setFieldValue(['core'], currentCore);
-        }
-      }
-
-      await (0, _csfTools.writeConfig)(main);
-    }
-  }
-
-};
-exports.newFrameworks = newFrameworks;

package/dist/cjs/automigrate/fixes/npm7.js

@@ -1,57 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.npm7 = void 0;
-
-var _chalk = _interopRequireDefault(require("chalk"));
-
-var _tsDedent = require("ts-dedent");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-/**
- * Is the user using npm7+? If so create a .npmrc with legacy-peer-deps=true
- */
-const npm7 = {
-  id: 'npm7',
-
-  async check({
-    packageManager
-  }) {
-    if (packageManager.type !== 'npm') return null;
-    const npmVersion = packageManager.getNpmVersion();
-
-    if (packageManager.needsLegacyPeerDeps(npmVersion)) {
-      return {
-        npmVersion
-      };
-    }
-
-    return null;
-  },
-
-  prompt({
-    npmVersion
-  }) {
-    const npmFormatted = _chalk.default.cyan(`npm ${npmVersion}`);
-
-    return (0, _tsDedent.dedent)`
-      We've detected you are running ${npmFormatted} which has peer dependency semantics which Storybook is incompatible with.
-
-      In order to work with Storybook's package structure, you'll need to run \`npm\` with the
-      \`--legacy-peer-deps=true\` flag. We can generate an \`.npmrc\` which will do that automatically.
-      
-      More info: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/issues/18298')}
-    `;
-  },
-
-  async run({
-    packageManager
-  }) {
-    packageManager.setLegacyPeerDeps();
-  }
-
-};
-exports.npm7 = npm7;

package/dist/cjs/automigrate/fixes/sb-scripts.js

@@ -1,140 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.sbScripts = exports.getStorybookScripts = void 0;
-
-var _chalk = _interopRequireDefault(require("chalk"));
-
-var _tsDedent = require("ts-dedent");
-
-var _semver = _interopRequireDefault(require("@storybook/semver"));
-
-var _coreCommon = require("@storybook/core-common");
-
-var _helpers = require("../../helpers");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-const logger = console;
-
-const getStorybookScripts = scripts => {
-  const storybookScripts = {
-    custom: {},
-    official: {}
-  };
-  Object.keys(scripts).forEach(key => {
-    if (key === 'storybook' || key === 'build-storybook') {
-      storybookScripts.official[key] = scripts[key];
-    } else if (scripts[key].match(/start-storybook/) || scripts[key].match(/build-storybook/)) {
-      storybookScripts.custom[key] = scripts[key];
-    }
-  });
-  return storybookScripts;
-};
-/**
- * Is the user using start-storybook
- *
- * If so:
- * - Add storybook dependency
- * - Change start-storybook and build-storybook scripts
- */
-
-
-exports.getStorybookScripts = getStorybookScripts;
-const sbScripts = {
-  id: 'sb-scripts',
-
-  async check({
-    packageManager
-  }) {
-    var _semver$coerce;
-
-    const packageJson = packageManager.retrievePackageJson();
-    const {
-      scripts = {},
-      devDependencies,
-      dependencies
-    } = packageJson;
-    const {
-      version: storybookVersion
-    } = (0, _coreCommon.getStorybookInfo)(packageJson);
-    const allDeps = Object.assign({}, dependencies, devDependencies);
-    const storybookCoerced = storybookVersion && ((_semver$coerce = _semver.default.coerce(storybookVersion)) === null || _semver$coerce === void 0 ? void 0 : _semver$coerce.version);
-
-    if (!storybookCoerced) {
-      logger.warn((0, _tsDedent.dedent)`
-        ❌ Unable to determine storybook version, skipping ${_chalk.default.cyan('sb-scripts')} fix.
-        🤔 Are you running automigrate from your project directory?
-      `);
-      return null;
-    }
-
-    if (allDeps.sb || allDeps.storybook) {
-      return null;
-    }
-
-    const storybookScripts = getStorybookScripts(scripts);
-
-    if (Object.keys(storybookScripts.official).length === 0 && Object.keys(storybookScripts.custom).length === 0) {
-      return null;
-    }
-
-    Object.keys(storybookScripts.official).forEach(key => {
-      storybookScripts.official[key] = storybookScripts.official[key].replace('start-storybook', 'storybook dev').replace('build-storybook', 'storybook build');
-    });
-    return _semver.default.gte(storybookCoerced, '7.0.0') ? {
-      packageJson,
-      storybookScripts,
-      storybookVersion
-    } : null;
-  },
-
-  prompt({
-    storybookVersion
-  }) {
-    const sbFormatted = _chalk.default.cyan(`Storybook ${storybookVersion}`);
-
-    const explanationMessage = [`Starting in Storybook 7, the ${_chalk.default.yellow('start-storybook')} and ${_chalk.default.yellow('build-storybook')} binaries have changed to ${_chalk.default.magenta('storybook dev')} and ${_chalk.default.magenta('storybook build')} respectively.`, `In order to work with ${sbFormatted}, Storybook's ${_chalk.default.magenta('storybook')} binary has to be installed and your storybook scripts have to be adjusted to use the binary. We can install the storybook binary and attempt to adjust your scripts for you.`].join('\n');
-    return [`We've detected you are using ${sbFormatted} with scripts from previous versions of Storybook.`, explanationMessage, `More info: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#start-storybook--build-storybook-binaries-removed')}`].filter(Boolean).join('\n\n');
-  },
-
-  async run({
-    result: {
-      storybookScripts,
-      packageJson
-    },
-    packageManager,
-    dryRun
-  }) {
-    logger.log();
-    logger.info(`Adding 'storybook' as dev dependency`);
-    logger.log();
-
-    if (!dryRun) {
-      const versionToInstall = (0, _helpers.getStorybookVersionSpecifier)(packageJson);
-      packageManager.addDependencies({
-        installAsDevDependencies: true
-      }, [`storybook@${versionToInstall}`]);
-    }
-
-    logger.info(`Updating scripts in package.json`);
-    logger.log();
-
-    if (!dryRun && Object.keys(storybookScripts.official).length > 0) {
-      const message = [`Migrating your scripts to:`, _chalk.default.yellow(JSON.stringify(storybookScripts.official, null, 2))].join('\n');
-      logger.log(message);
-      logger.log();
-      packageManager.addScripts(storybookScripts.official);
-    }
-
-    if (!dryRun && Object.keys(storybookScripts.custom).length > 0) {
-      const message = [`We detected custom scripts that we can't automigrate:`, _chalk.default.yellow(JSON.stringify(storybookScripts.custom, null, 2)), '\n', `Please manually migrate the ones applicable and use the documentation below for reference: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#start-storybook--build-storybook-binaries-removed')}`].join('\n');
-      logger.log(message);
-      logger.log();
-    }
-  }
-
-};
-exports.sbScripts = sbScripts;

package/dist/cjs/automigrate/fixes/vue3.js

@@ -1,77 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.vue3 = void 0;
-
-var _chalk = _interopRequireDefault(require("chalk"));
-
-var _tsDedent = require("ts-dedent");
-
-var _semver = _interopRequireDefault(require("@storybook/semver"));
-
-var _webpack = require("./webpack5");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-/**
- * Is the user upgrading to Vue3?
- *
- * If so:
- * - Run webpack5 fix
- */
-const vue3 = {
-  id: 'vue3',
-
-  async check({
-    packageManager
-  }) {
-    var _semver$coerce;
-
-    const packageJson = packageManager.retrievePackageJson();
-    const {
-      dependencies,
-      devDependencies
-    } = packageJson;
-    const vueVersion = dependencies.vue || devDependencies.vue;
-    const vueCoerced = (_semver$coerce = _semver.default.coerce(vueVersion)) === null || _semver$coerce === void 0 ? void 0 : _semver$coerce.version;
-
-    if (!vueCoerced || _semver.default.lt(vueCoerced, '3.0.0')) {
-      return null;
-    }
-
-    const builderInfo = await _webpack.webpack5.checkWebpack5Builder(packageJson);
-    return builderInfo ? Object.assign({
-      vueVersion
-    }, builderInfo) : null;
-  },
-
-  prompt({
-    vueVersion,
-    storybookVersion
-  }) {
-    const vueFormatted = _chalk.default.cyan(`Vue ${vueVersion}`);
-
-    const sbFormatted = _chalk.default.cyan(`Storybook ${storybookVersion}`);
-
-    return (0, _tsDedent.dedent)`
-      We've detected you are running ${vueFormatted} with Storybook.
-      ${sbFormatted} runs webpack4 by default, which is incompatible.
-
-      In order to work with your version of Vue, we need to install Storybook's ${_chalk.default.cyan('webpack5 builder')}.
-
-      More info: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#vue3-upgrade')}
-    `;
-  },
-
-  async run(options) {
-    return _webpack.webpack5.run(Object.assign({}, options, {
-      result: Object.assign({
-        webpackVersion: null
-      }, options.result)
-    }));
-  }
-
-};
-exports.vue3 = vue3;