Sergei Basharov
Sergei Basharov

Reputation: 53840

Format argument value before passing to a yarn/npm script

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

Upvotes: 0

Views: 371

Answers (1)

Ivan V.
Ivan V.

Reputation: 8081

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

  1. 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.

Upvotes: 1

Related Questions