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 — RobC
– RobC, Commented Mar 17, 2021 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. — RobC
– RobC, Commented Mar 17, 2021 at 12:26

Ivan V. · Accepted Answer · 2021-03-17 12:05:25Z

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.

Collectives™ on Stack Overflow

Format argument value before passing to a yarn/npm script

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related