Format argument value before passing to a yarn/npm script

Question

I have a storybook start script which I want to run for some specific folder:

"storybook": "start-storybook -p 6006 -s ./src"

This loads all stories from src folder. As the amount of stories becomes larger, I want to run stories only from some of subfolders:

start-storybook -p 6006 -s ./src/components/CommonComponents
start-storybook -p 6006 -s ./src/components/DashboardComponents

How can I format argument value dynamically in order to start storybook like this below?

$ yarn storybook CommonComponents

And it would turn into:

start-storybook -p 6006 -s ./src/components/CommonComponents

Does this answer your question? [Pass command line args to npm scripts in package.json](https://stackoverflow.com/questions/51388921/pass-command-line-args-to-npm-scripts-in-package-json) — RobC, Mar 17 '21 at 12:23
On _*nix_ consider utilizing a shell function. For example, define your script in _package,json_ as `"storybook": "func() { start-storybook -p 6006 -s \"./src/${1}\"; }; func"`, then run the following command: `yarn run storybook components/CommonComponents`. For a cross-plaform solution you'll need to consider writing a node.js script which is also described in my answer [here](https://stackoverflow.com/questions/51388921/pass-command-line-args-to-npm-scripts-in-package-json). — RobC, Mar 17 '21 at 12:26

score 1 · Answer 1 · answered Mar 17 '21 at 12:05

storybook task could be a script, and then inside the script you parse the arguments, and call start-storybook

Create a task in package.json (e.q run-storybook) and set it to execute the custom script:

"run-storybook": yarn ./path/to/script.js

#!/bin/env node

// script.js

const { spawn } = require('child_process')
const args = process.argv.slice(2)
const port = args[1]
const component = args[3]

const path = `./src/components/${component}`

spawn('yarn', ['start-storybook', '-p', port, '-s', path], {
  stdio: 'inherit',
  shell: true
})

Then you can call: yarn run-storybook -p 600 -s yourcomponent

Note: make sure the script is executable: chmod +x /path/to/script.js.

Format argument value before passing to a yarn/npm script

1 Answers1