Use yarn!

CHANGELOG.md

@@ -1,6 +1,6 @@
 # Changelog
 
-### v1.5.1
+### v1.5.2
 07-Oct-2016
 
 * Update more user friendly welcome screen to REACT_SCRIPTS generator.

README.md

@@ -20,4 +20,25 @@ That's all you've to do.
 
 ---
 
+## Yarn support
+
+getstorybook also supports yarn. If you are using yarn, this is how to use it:
+
+```
+yarn global add getstorybook
+getstorybook --use-yarn
+```
+
+`getstorybook` will identify it's installed with yarn and it'll use yarn to install deps.
+
+> This is the way, if you wanna use yarn for all of your storybook projects.
+
+If that's not the case, you can do this:
+
+```
+npm i -g getstorybook
+getstorybook --use-yarn
+
+```
+
 For more information, refer [React Storybook](https://github.com/kadirahq/react-storybook) documentation.

bin/generate.js

@@ -9,7 +9,7 @@ var types = require('../lib/project_types');
 var commandLog = require('../lib/helpers').commandLog;
 var codeLog = require('../lib/helpers').codeLog;
 var paddedLog = require('../lib/helpers').paddedLog;
-var installNpmDeps = require('../lib/helpers').installNpmDeps;
+var installDeps = require('../lib/helpers').installDeps;
 var chalk = require('chalk');
 var logger = console;
 
@@ -18,12 +18,21 @@ var pkg = require('../package.json');
 program
   .version(pkg.version)
   .option('-f --force', 'Forcely add storybook')
+  .option('-Y --use-yarn', 'Use yarn to install deps')
   .parse(process.argv);
 
 var welcomeMessage =
   'getstorybook - the simplest way to add a storybook to your project.';
 logger.log(chalk.inverse('\n ' + welcomeMessage + ' \n'));
 
+var useYarn = Boolean(program.useYarn) || /\.yarn-cache/.test(__dirname);
+
+var npmOptions = {
+  useYarn: useYarn
+};
+
+var runStorybookCommand = useYarn? 'yarn run storybook' : 'npm run storybook';
+
 // Update notify code.
 updateNotifier({
   pkg: pkg,
@@ -55,11 +64,11 @@ switch (projectType) {
     require('../generators/REACT_SCRIPTS');
     done();
 
-    installNpmDeps();
+    installDeps(npmOptions);
 
     logger.log('\nTo run your storybook, type:\n');
     codeLog([
-      'npm run storybook'
+      runStorybookCommand
     ]);
     logger.log('\nFor more information visit:', chalk.cyan('http://getstorybook.io'));
     break;
@@ -69,11 +78,11 @@ switch (projectType) {
     require('../generators/REACT');
     done();
 
-    installNpmDeps();
+    installDeps(npmOptions);
 
     logger.log('\nTo run your storybook, type:\n');
     codeLog([
-      'npm run storybook'
+      runStorybookCommand
     ]);
     logger.log('\nFor more information visit:', chalk.cyan('http://getstorybook.io'));
     break;
@@ -83,11 +92,11 @@ switch (projectType) {
     require('../generators/REACT_NATIVE');
     done();
 
-    installNpmDeps();
+    installDeps(npmOptions);
 
     logger.log('\nTo run your storybook, type:\n');
     codeLog([
-      'npm run storybook'
+      runStorybookCommand
     ]);
     logger.log('\nFor more information visit:', chalk.cyan('http://getstorybook.io'));
     break;
@@ -97,11 +106,11 @@ switch (projectType) {
     require('../generators/METEOR');
     done();
 
-    installNpmDeps();
+    installDeps(npmOptions);
 
     logger.log('\nTo run your storybook, type:\n');
     codeLog([
-      'npm run storybook'
+      runStorybookCommand
     ]);
     logger.log('\nFor more information visit:', chalk.cyan('http://getstorybook.io'));
     break;
@@ -111,11 +120,11 @@ switch (projectType) {
     require('../generators/WEBPACK_REACT');
     done();
 
-    installNpmDeps();
+    installDeps(npmOptions);
 
     logger.log('\nTo run your storybook, type:\n');
     codeLog([
-      'npm run storybook'
+      runStorybookCommand
     ]);
     logger.log('\nFor more information visit:', chalk.cyan('http://getstorybook.io'));
     break;
@@ -125,11 +134,11 @@ switch (projectType) {
     require('../generators/REACT');
     done();
 
-    installNpmDeps();
+    installDeps(npmOptions);
 
     logger.log('\nTo run your storybook, type:\n');
     codeLog([
-      'npm run storybook'
+      runStorybookCommand
     ]);
     logger.log('\nFor more information visit:', chalk.cyan('http://getstorybook.io'));
     break;

generators/REACT_SCRIPTS/template/src/stories/Welcome.js

@@ -81,8 +81,8 @@ export default class Welcome extends React.Component {
           />
         </p>
         <p>
-          Usually we create stories with smaller UI components in your app.<br />
-          Have a look at the <a href="https://getstorybook.io/docs/basics/writing-stories" target="_blank">Writing Stories</a> section in our documentation.
+          Usually we create stories with smaller UI components in the app.<br />
+          Have a look at the <a style={styles.link} href="https://getstorybook.io/docs/basics/writing-stories" target="_blank">Writing Stories</a> section in our documentation.
         </p>
       </div>
     );

lib/helpers.js

@@ -86,14 +86,22 @@ exports.codeLog = function codeLog(codeLines, leftPadAmount) {
   logger.log(finalResult);
 };
 
-exports.installNpmDeps = function () {
-  var done = exports.commandLog('Preparing to install NPM dependencies');
+exports.installDeps = function (options) {
+  var done = exports.commandLog('Preparing to install dependencies');
   done();
+  console.log();
 
-  var result = spawnSync('npm', ['install'], { stdio: 'inherit' });
-  done = exports.commandLog('Installing NPM dependencies');
+  var result;
+  if (options.useYarn) {
+    result = spawnSync('yarn', { stdio: 'inherit' });
+  } else {
+    result = spawnSync('npm', ['install'], { stdio: 'inherit' });
+  }
+
+  console.log();
+  done = exports.commandLog('Installing dependencies');
   if (result.status !== 0) {
-    done('An error occured while running `npm install`.');
+    done('An error occured while installing dependencies`.');
     process.exit(1);
   }
   done();

package.json

@@ -1,6 +1,6 @@
 {
   "name": "getstorybook",
-  "version": "1.5.1",
+  "version": "1.5.3",
   "description": "Easiest way to add Storybook support to your project.",
   "bin": {
     "getstorybook": "./bin/generate.js"