@storybook/cli 6.5.7-alpha.0 → 7.0.0-alpha.1

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

@@ -50,18 +50,15 @@ const angular12 = {
   },
 
   prompt({
-    angularVersion,
-    storybookVersion
+    angularVersion
   }) {
     const angularFormatted = _chalk.default.cyan(`Angular ${angularVersion}`);
 
-    const sbFormatted = _chalk.default.cyan(`Storybook ${storybookVersion}`);
-
     return (0, _tsDedent.default)`
       We've detected you are running ${angularFormatted} which is powered by webpack5.
-      ${sbFormatted} runs webpack4 by default, which is incompatible.
+      Your Storybook's main.js files specifies webpack4, which is incompatible.
 
-      In order to work with your version of Angular, we need to install Storybook's ${_chalk.default.cyan('webpack5 builder')}.
+      In order to work with your version of Angular, we need to install Storybook's ${_chalk.default.cyan('@storybook/builder-webpack5')}.
 
       More info: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#angular12-upgrade')}
     `;

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

@@ -15,8 +15,12 @@ var _semver = _interopRequireDefault(require("@storybook/semver"));
 
 var _webpack = require("./webpack5");
 
+const _excluded = ["craVersion"];
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 /**
  * Is the user upgrading from CRA4 to CRA5?
  *
@@ -49,19 +53,20 @@ const cra5 = {
     }, builderInfo) : null;
   },
 
-  prompt({
-    craVersion,
-    storybookVersion
-  }) {
-    const craFormatted = _chalk.default.cyan(`Create React App (CRA) ${craVersion}`);
+  prompt(_ref) {
+    let {
+      craVersion
+    } = _ref,
+        rest = _objectWithoutPropertiesLoose(_ref, _excluded);
 
-    const sbFormatted = _chalk.default.cyan(`Storybook ${storybookVersion}`);
+    const craFormatted = _chalk.default.cyan(`Create React App (CRA) ${craVersion}`);
 
+    console.log(Object.assign({}, rest));
     return (0, _tsDedent.default)`
       We've detected you are running ${craFormatted} which is powered by webpack5.
-      ${sbFormatted} runs webpack4 by default, which is incompatible.
+      Your Storybook's main.js files specifies webpack4, which is incompatible.
 
-      In order to work with your version of CRA, we need to install Storybook's ${_chalk.default.cyan('webpack5 builder')}.
+      In order to work with your version of CRA, we need to install Storybook's ${_chalk.default.cyan('@storybook/builder-webpack5')}.
 
       More info: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#cra5-upgrade')}
     `;

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

@@ -14,6 +14,8 @@ var _webpack = require("./webpack5");
 
 var _angular = require("./angular12");
 
+var _vue = require("./vue3");
+
 var _mainjsFramework = require("./mainjsFramework");
 
 var _eslintPlugin = require("./eslint-plugin");
@@ -33,5 +35,5 @@ Object.keys(_types).forEach(function (key) {
     }
   });
 });
-const fixes = [_cra.cra5, _webpack.webpack5, _angular.angular12, _mainjsFramework.mainjsFramework, _eslintPlugin.eslintPlugin, _builderVite.builderVite];
+const fixes = [_cra.cra5, _webpack.webpack5, _angular.angular12, _vue.vue3, _mainjsFramework.mainjsFramework, _eslintPlugin.eslintPlugin, _builderVite.builderVite];
 exports.fixes = fixes;

package/dist/{modern/automigrate/fixes/cra5.js → cjs/automigrate/fixes/vue3.js}

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.cra5 = void 0;
+exports.vue3 = void 0;
 
 require("core-js/modules/es.promise.js");
 
@@ -18,13 +18,13 @@ var _webpack = require("./webpack5");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /**
- * Is the user upgrading from CRA4 to CRA5?
+ * Is the user upgrading to Vue3?
  *
  * If so:
  * - Run webpack5 fix
  */
-const cra5 = {
-  id: 'cra5',
+const vue3 = {
+  id: 'vue3',
 
   async check({
     packageManager
@@ -36,34 +36,34 @@ const cra5 = {
       dependencies,
       devDependencies
     } = packageJson;
-    const craVersion = dependencies['react-scripts'] || devDependencies['react-scripts'];
-    const craCoerced = (_semver$coerce = _semver.default.coerce(craVersion)) === null || _semver$coerce === void 0 ? void 0 : _semver$coerce.version;
+    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 (!craCoerced || _semver.default.lt(craCoerced, '5.0.0')) {
+    if (!vueCoerced || _semver.default.lt(vueCoerced, '3.0.0')) {
       return null;
     }
 
     const builderInfo = await _webpack.webpack5.checkWebpack5Builder(packageJson);
     return builderInfo ? Object.assign({
-      craVersion
+      vueVersion
     }, builderInfo) : null;
   },
 
   prompt({
-    craVersion,
+    vueVersion,
     storybookVersion
   }) {
-    const craFormatted = _chalk.default.cyan(`Create React App (CRA) ${craVersion}`);
+    const vueFormatted = _chalk.default.cyan(`Vue ${vueVersion}`);
 
     const sbFormatted = _chalk.default.cyan(`Storybook ${storybookVersion}`);
 
     return (0, _tsDedent.default)`
-      We've detected you are running ${craFormatted} which is powered by webpack5.
+      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 CRA, we need to install Storybook's ${_chalk.default.cyan('webpack5 builder')}.
+      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#cra5-upgrade')}
+      More info: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#vue3-upgrade')}
     `;
   },
 
@@ -76,4 +76,4 @@ const cra5 = {
   }
 
 };
-exports.cra5 = cra5;
+exports.vue3 = vue3;

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

@@ -107,18 +107,15 @@ const webpack5 = {
   },
 
   prompt({
-    webpackVersion,
-    storybookVersion
+    webpackVersion
   }) {
     const webpackFormatted = _chalk.default.cyan(`webpack ${webpackVersion}`);
 
-    const sbFormatted = _chalk.default.cyan(`Storybook ${storybookVersion}`);
-
     return (0, _tsDedent.default)`
       We've detected you're running ${webpackFormatted}.
-      ${sbFormatted} runs webpack4 by default, which may not be compatible.
+      Your Storybook's main.js files specifies webpack4, which is incompatible.
       
-      To run Storybook in webpack5-mode, we can install Storybook's ${_chalk.default.cyan('webpack5 builder')} for you.
+      To run Storybook in webpack5-mode, we can install Storybook's ${_chalk.default.cyan('@storybook/builder-webpack5')} for you.
 
       More info: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#webpack-5-manager-build')}
     `;
@@ -144,10 +141,10 @@ const webpack5 = {
     if (!dryRun) packageManager.addDependencies({
       installAsDevDependencies: true
     }, deps);
-    logger.info('✅ Setting `core.builder` to `webpack5` in main.js');
+    logger.info('✅ Setting `core.builder` to `@storybook/builder-webpack5` in main.js');
 
     if (!dryRun) {
-      main.setFieldValue(['core', 'builder'], 'webpack5');
+      main.setFieldValue(['core', 'builder'], '@storybook/builder-webpack5');
       await (0, _csfTools.writeConfig)(main);
     }
   }

package/dist/cjs/babel-config.js

@@ -33,9 +33,7 @@ const generateStorybookBabelConfig = async ({
 }) => {
   _nodeLogger.logger.info(`Generating the storybook default babel config at ${target}`);
 
-  const config = (0, _coreCommon.getStorybookBabelConfig)({
-    local: true
-  });
+  const config = (0, _coreCommon.getStorybookBabelConfig)();
   const contents = JSON.stringify(config, null, 2);
   const fileName = '.babelrc.json';
 

package/dist/cjs/build.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.build = void 0;
+
+require("core-js/modules/es.promise.js");
+
+var _readPkgUp = require("read-pkg-up");
+
+var _nodeLogger = require("@storybook/node-logger");
+
+var _coreServer = require("@storybook/core-server");
+
+var _coreCommon = require("@storybook/core-common");
+
+const build = async cliOptions => {
+  try {
+    await (0, _coreServer.buildStaticStandalone)(Object.assign({}, cliOptions, {
+      configDir: cliOptions.configDir || './.storybook',
+      outputDir: cliOptions.outputDir || './storybook-static',
+      ignorePreview: !!cliOptions.previewUrl && !cliOptions.forceBuildPreview,
+      docsMode: !!cliOptions.docs,
+      configType: 'PRODUCTION',
+      cache: _coreCommon.cache,
+      packageJson: (0, _readPkgUp.sync)({
+        cwd: __dirname
+      }).packageJson
+    }));
+  } catch (e) {
+    _nodeLogger.logger.error(e);
+
+    process.exit(1);
+  }
+};
+
+exports.build = build;

package/dist/cjs/detect.js

@@ -21,8 +21,6 @@ var _helpers = require("./helpers");
 
 var _jsPackageManager = require("./js-package-manager");
 
-var _detectWebpack = require("./detect-webpack");
-
 var _detectNextjs = require("./detect-nextjs");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -107,7 +105,7 @@ function detectFrameworkPreset(packageJson = {}) {
 }
 /**
  * Attempts to detect which builder to use, by searching for a vite config file.  If one is found, the vite builder
- * will be used, otherwise, webpack4 is the default.
+ * will be used, otherwise, webpack5 is the default.
  *
  * @returns CoreBuilder
  */
@@ -127,22 +125,10 @@ function detectBuilder(packageManager) {
     if (nextJSVersion >= 11) {
       return _project_types.CoreBuilder.Webpack5;
     }
-  }
-
-  const webpackVersion = (0, _detectWebpack.detectWebpack)(packageManager);
-
-  if (webpackVersion) {
-    if (webpackVersion <= 4) {
-      return _project_types.CoreBuilder.Webpack4;
-    }
-
-    if (webpackVersion >= 5) {
-      return _project_types.CoreBuilder.Webpack5;
-    }
-  } // Fallback to webpack4
+  } // Fallback to webpack5
 
 
-  return _project_types.CoreBuilder.Webpack4;
+  return _project_types.CoreBuilder.Webpack5;
 }
 
 function isStorybookInstalled(dependencies, force) {
@@ -151,13 +137,9 @@ function isStorybookInstalled(dependencies, force) {
   }
 
   if (!force && dependencies.devDependencies) {
-    if (_project_types.SUPPORTED_FRAMEWORKS.reduce((storybookPresent, framework) => storybookPresent || !!dependencies.devDependencies[`@storybook/${framework}`], false)) {
+    if (_project_types.SUPPORTED_RENDERERS.reduce((storybookPresent, framework) => storybookPresent || !!dependencies.devDependencies[`@storybook/${framework}`], false)) {
       return _project_types.ProjectType.ALREADY_HAS_STORYBOOK;
     }
-
-    if (dependencies.devDependencies['@kadira/storybook'] || dependencies.devDependencies['@kadira/react-native-storybook']) {
-      return _project_types.ProjectType.UPDATE_PACKAGE_ORGANIZATIONS;
-    }
   }
 
   return false;

package/dist/cjs/dev.js

@@ -0,0 +1,70 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.dev = void 0;
+
+require("core-js/modules/es.promise.js");
+
+var _tsDedent = _interopRequireDefault(require("ts-dedent"));
+
+var _readPkgUp = require("read-pkg-up");
+
+var _nodeLogger = require("@storybook/node-logger");
+
+var _coreServer = require("@storybook/core-server");
+
+var _coreCommon = require("@storybook/core-common");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const dev = async cliOptions => {
+  process.env.NODE_ENV = process.env.NODE_ENV || 'development';
+
+  try {
+    await (0, _coreServer.buildDevStandalone)(Object.assign({}, cliOptions, {
+      configDir: cliOptions.configDir || './.storybook',
+      configType: 'DEVELOPMENT',
+      ignorePreview: !!cliOptions.previewUrl && !cliOptions.forceBuildPreview,
+      docsMode: !!cliOptions.docs,
+      cache: _coreCommon.cache,
+      packageJson: (0, _readPkgUp.sync)({
+        cwd: __dirname
+      }).packageJson
+    }));
+  } catch (error) {
+    var _error$compilation;
+
+    // this is a weird bugfix, somehow 'node-pre-gyp' is polluting the npmLog header
+    _nodeLogger.instance.heading = '';
+
+    if (error instanceof Error) {
+      if (error.error) {
+        _nodeLogger.logger.error(error.error);
+      } else if (error.stats && error.stats.compilation.errors) {
+        error.stats.compilation.errors.forEach(e => _nodeLogger.logger.plain(e));
+      } else {
+        _nodeLogger.logger.error(error);
+      }
+    } else if ((_error$compilation = error.compilation) !== null && _error$compilation !== void 0 && _error$compilation.errors) {
+      error.compilation.errors.forEach(e => _nodeLogger.logger.plain(e));
+    }
+
+    _nodeLogger.logger.line();
+
+    _nodeLogger.logger.warn(error.close ? (0, _tsDedent.default)`
+          FATAL broken build!, will close the process,
+          Fix the error below and restart storybook.
+        ` : (0, _tsDedent.default)`
+          Broken build, fix the error above.
+          You may need to refresh the browser.
+        `);
+
+    _nodeLogger.logger.line();
+
+    process.exit(1);
+  }
+};
+
+exports.dev = dev;

package/dist/cjs/extract.js

@@ -32,7 +32,6 @@ const read = async url => {
     (window.__STORYBOOK_STORY_STORE__ && window.__STORYBOOK_STORY_STORE__.extract && window.__STORYBOOK_STORY_STORE__.extract())
   `);
   const data = JSON.parse(await page.evaluate(async () => {
-    // eslint-disable-next-line no-undef
     return JSON.stringify(window.__STORYBOOK_STORY_STORE__.getStoriesJsonData(), null, 2);
   }));
   setImmediate(() => {

package/dist/cjs/generate.js

@@ -14,6 +14,8 @@ var _leven = _interopRequireDefault(require("leven"));
 
 var _readPkgUp = require("read-pkg-up");
 
+var _nodeLogger = require("@storybook/node-logger");
+
 var _initiate = require("./initiate");
 
 var _add = require("./add");
@@ -32,12 +34,18 @@ var _automigrate = require("./automigrate");
 
 var _babelConfig = require("./babel-config");
 
+var _dev = require("./dev");
+
+var _build = require("./build");
+
+var _utils = require("./utils");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const pkg = (0, _readPkgUp.sync)({
   cwd: __dirname
 }).packageJson;
-const logger = console;
+const consoleLogger = console;
 
 _commander.default.option('--disable-telemetry', 'disable sending telemetry data', // default value is false, but if the user sets STORYBOOK_DISABLE_TELEMETRY, it can be true
 process.env.STORYBOOK_DISABLE_TELEMETRY && process.env.STORYBOOK_DISABLE_TELEMETRY !== 'false');
@@ -53,7 +61,7 @@ _commander.default.command('babelrc').description('generate the default storyboo
 _commander.default.command('upgrade').description('Upgrade your Storybook packages to the latest').option('-N --use-npm', 'Use NPM to build the Storybook server').option('-y --yes', 'Skip prompting the user').option('-n --dry-run', 'Only check for upgrades, do not install').option('-p --prerelease', 'Upgrade to the pre-release packages').option('-s --skip-check', 'Skip postinstall version and automigration checks').action(options => (0, _upgrade.upgrade)(options));
 
 _commander.default.command('info').description('Prints debugging information about the local environment').action(() => {
-  logger.log(_chalk.default.bold('\nEnvironment Info:'));
+  consoleLogger.log(_chalk.default.bold('\nEnvironment Info:'));
 
   _envinfo.default.run({
     System: ['OS', 'CPU'],
@@ -61,7 +69,7 @@ _commander.default.command('info').description('Prints debugging information abo
     Browsers: ['Chrome', 'Edge', 'Firefox', 'Safari'],
     npmPackages: '@storybook/*',
     npmGlobalPackages: '@storybook/*'
-  }).then(logger.log);
+  }).then(consoleLogger.log);
 });
 
 _commander.default.command('migrate [migration]').description('Run a Storybook codemod migration on your source files').option('-l --list', 'List available migrations').option('-g --glob <glob>', 'Glob for files upon which to apply the migration', '**/*.js').option('-p --parser <babel | babylon | flow | ts | tsx>', 'jscodeshift parser').option('-n --dry-run', 'Dry run: verify the migration exists and show the files to which it will be applied').option('-r --rename <from-to>', 'Rename suffix of matching files after codemod has been applied, e.g. ".js:.ts"').action((migration, {
@@ -79,35 +87,40 @@ _commander.default.command('migrate [migration]').description('Run a Storybook c
     list,
     rename,
     parser,
-    logger
+    logger: consoleLogger
   }).catch(err => {
-    logger.error(err);
+    _nodeLogger.logger.error(err);
+
     process.exit(1);
   });
 });
 
 _commander.default.command('extract [location] [output]').description('extract stories.json from a built version').action((location = 'storybook-static', output = _path.default.join(location, 'stories.json')) => (0, _extract.extract)(location, output).catch(e => {
-  logger.error(e);
+  _nodeLogger.logger.error(e);
+
   process.exit(1);
 }));
 
-_commander.default.command('repro [outputDirectory]').description('Create a reproduction from a set of possible templates').option('-f --framework <framework>', 'Filter on given framework').option('-t --template <template>', 'Use the given template').option('-l --list', 'List available templates').option('-g --generator <generator>', 'Use custom generator command').option('--pnp', "Use Yarn Plug'n'Play mode instead of node_modules one").option('--e2e', 'Used in e2e context').action((outputDirectory, {
-  framework,
+_commander.default.command('repro [outputDirectory]').description('Create a reproduction from a set of possible templates').option('-f --renderer <renderer>', 'Filter on given renderer').option('-t --template <template>', 'Use the given template').option('-l --list', 'List available templates').option('-g --generator <generator>', 'Use custom generator command').option('--pnp', "Use Yarn Plug'n'Play mode instead of node_modules one").option('--local', "use storybook's local packages instead of yarn's registry").option('--e2e', 'Used in e2e context').action((outputDirectory, {
+  renderer,
   template,
   list,
   e2e,
   generator,
-  pnp
+  pnp,
+  local
 }) => (0, _repro.repro)({
   outputDirectory,
-  framework,
+  renderer,
   template,
   list,
   e2e,
+  local,
   generator,
   pnp
 }).catch(e => {
-  logger.error(e);
+  _nodeLogger.logger.error(e);
+
   process.exit(1);
 }));
 
@@ -117,26 +130,69 @@ _commander.default.command('link <repo-url-or-directory>').description('Pull dow
   target,
   local
 }).catch(e => {
-  logger.error(e);
+  _nodeLogger.logger.error(e);
+
   process.exit(1);
 }));
 
 _commander.default.command('automigrate [fixId]').description('Check storybook for known problems or migrations and apply fixes').option('-y --yes', 'Skip prompting the user').option('-n --dry-run', 'Only check for fixes, do not actually run them').action((fixId, options) => (0, _automigrate.automigrate)(Object.assign({
   fixId
 }, options)).catch(e => {
-  logger.error(e);
+  _nodeLogger.logger.error(e);
+
   process.exit(1);
 }));
 
+_commander.default.command('dev').option('-p, --port <number>', 'Port to run Storybook', str => parseInt(str, 10)).option('-h, --host <string>', 'Host to run Storybook').option('-s, --static-dir <dir-names>', 'Directory where to load static files from', _utils.parseList).option('-c, --config-dir <dir-name>', 'Directory where to load Storybook configurations from').option('--https', 'Serve Storybook over HTTPS. Note: You must provide your own certificate information.').option('--ssl-ca <ca>', 'Provide an SSL certificate authority. (Optional with --https, required if using a self-signed certificate)', _utils.parseList).option('--ssl-cert <cert>', 'Provide an SSL certificate. (Required with --https)').option('--ssl-key <key>', 'Provide an SSL key. (Required with --https)').option('--smoke-test', 'Exit after successful start').option('--ci', "CI mode (skip interactive prompts, don't open browser)").option('--no-open', 'Do not open Storybook automatically in the browser').option('--loglevel <level>', 'Control level of logging during build').option('--quiet', 'Suppress verbose build output').option('--no-version-updates', 'Suppress update check', true).option('--no-release-notes', 'Suppress automatic redirects to the release notes after upgrading', true).option('--no-manager-cache', 'Do not cache the manager UI').option('--debug-webpack', 'Display final webpack configurations for debugging purposes').option('--webpack-stats-json [directory]', 'Write Webpack Stats JSON to disk').option('--preview-url <string>', 'Disables the default storybook preview and lets your use your own').option('--force-build-preview', 'Build the preview iframe even if you are using --preview-url').option('--docs', 'Build a documentation-only site using addon-docs').action(options => {
+  _nodeLogger.logger.setLevel(_commander.default.loglevel);
+
+  consoleLogger.log(_chalk.default.bold(`${pkg.name} v${pkg.version}`) + _chalk.default.reset('\n')); // The key is the field created in `program` variable for
+  // each command line argument. Value is the env variable.
+
+  (0, _utils.getEnvConfig)(_commander.default, {
+    port: 'SBCONFIG_PORT',
+    host: 'SBCONFIG_HOSTNAME',
+    staticDir: 'SBCONFIG_STATIC_DIR',
+    configDir: 'SBCONFIG_CONFIG_DIR',
+    ci: 'CI'
+  });
+
+  if (typeof _commander.default.port === 'string' && _commander.default.port.length > 0) {
+    _commander.default.port = parseInt(_commander.default.port, 10);
+  }
+
+  (0, _dev.dev)(Object.assign({}, options, {
+    packageJson: pkg
+  }));
+});
+
+_commander.default.command('build').option('-s, --static-dir <dir-names>', 'Directory where to load static files from', _utils.parseList).option('-o, --output-dir <dir-name>', 'Directory where to store built files').option('-c, --config-dir <dir-name>', 'Directory where to load Storybook configurations from').option('--quiet', 'Suppress verbose build output').option('--loglevel <level>', 'Control level of logging during build').option('--debug-webpack', 'Display final webpack configurations for debugging purposes').option('--webpack-stats-json [directory]', 'Write Webpack Stats JSON to disk').option('--preview-url <string>', 'Disables the default storybook preview and lets your use your own').option('--force-build-preview', 'Build the preview iframe even if you are using --preview-url').option('--docs', 'Build a documentation-only site using addon-docs').option('--no-manager-cache', 'Do not cache the manager UI').action(options => {
+  process.env.NODE_ENV = process.env.NODE_ENV || 'production';
+
+  _nodeLogger.logger.setLevel(_commander.default.loglevel);
+
+  consoleLogger.log(_chalk.default.bold(`${pkg.name} v${pkg.version}\n`)); // The key is the field created in `program` variable for
+  // each command line argument. Value is the env variable.
+
+  (0, _utils.getEnvConfig)(_commander.default, {
+    staticDir: 'SBCONFIG_STATIC_DIR',
+    outputDir: 'SBCONFIG_OUTPUT_DIR',
+    configDir: 'SBCONFIG_CONFIG_DIR'
+  });
+  (0, _build.build)(Object.assign({}, options, {
+    packageJson: pkg
+  }));
+});
+
 _commander.default.on('command:*', ([invalidCmd]) => {
-  logger.error(' Invalid command: %s.\n See --help for a list of available commands.', invalidCmd); // eslint-disable-next-line
+  consoleLogger.error(' Invalid command: %s.\n See --help for a list of available commands.', invalidCmd); // eslint-disable-next-line
 
   const availableCommands = _commander.default.commands.map(cmd => cmd._name);
 
   const suggestion = availableCommands.find(cmd => (0, _leven.default)(cmd, invalidCmd) < 3);
 
   if (suggestion) {
-    logger.log(`\n Did you mean ${suggestion}?`);
+    consoleLogger.info(`\n Did you mean ${suggestion}?`);
   }
 
   process.exit(1);

package/dist/cjs/generators/REACT_NATIVE/index.js

@@ -37,7 +37,7 @@ const generator = async (packageManager, npmOptions, installServer) => {
   const webAddonsV5 = ['@storybook/addon-links@^5.3', '@storybook/addon-knobs@^5.3', '@storybook/addon-actions@^5.3'];
   const nativeAddons = ['@storybook/addon-ondevice-knobs', '@storybook/addon-ondevice-actions'];
   const packagesToResolve = [...nativeAddons, '@storybook/react-native', installServer && '@storybook/react-native-server'].filter(Boolean);
-  const resolvedPackages = await packageManager.getVersionedPackages(...packagesToResolve);
+  const resolvedPackages = await packageManager.getVersionedPackages(packagesToResolve);
   const babelDependencies = await (0, _helpers.getBabelDependencies)(packageManager, packageJson);
   const packages = [...babelDependencies, ...resolvedPackages, ...webAddonsV5, missingReactDom && reactVersion && `react-dom@${reactVersion}`].filter(Boolean);
   packageManager.addDependencies(Object.assign({}, npmOptions, {

package/dist/cjs/generators/REACT_SCRIPTS/index.js

@@ -22,13 +22,14 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 const generator = async (packageManager, npmOptions, options) => {
   var _semver$coerce;
 
+  const monorepoRootPath = _path.default.join(__dirname, '..', '..', '..', '..', '..', '..');
+
   const extraMain = options.linkable ? {
     webpackFinal: `%%(config) => {
-      const path = require('path');
       // add monorepo root as a valid directory to import modules from
       config.resolve.plugins.forEach((p) => {
         if (Array.isArray(p.appSrcs)) {
-          p.appSrcs.push(path.join(__dirname, '..', '..', '..', 'storybook'));
+          p.appSrcs.push('${monorepoRootPath}');
         }
       });
       return config;