@nrwl/storybook:build
Build storybook in production mode.
Options can be configured in project.json
when defining the executor, or when invoking it. Read more about how to configure targets and executors here: https://nx.dev/reference/project-configuration#targets.
project.json
:
//...
"ui": {
"targets": {
//...
"build-storybook": {
"executor": "@nrwl/storybook:build",
"outputs": ["{options.outputPath}"],
"options": {
"uiFramework": "@storybook/react",
"outputPath": "dist/storybook/ui",
"config": {
"configFolder": "libs/ui/.storybook"
}
},
"configurations": {
"ci": {
"quiet": true
}
}
}
}
nx run ui:build-storybook
Examples
For non-Angular projects
You can change the uiFramework
option, to correspond to the framework you are using for your project. Supported values are: "@storybook/react"
, "@storybook/html"
, "@storybook/web-components"
, "@storybook/vue"
, "@storybook/vue3"
and "@storybook/svelte"
. If you are using Angular, please check out the Angular-specific Storybook executor.
"build-storybook": {
"executor": "@nrwl/storybook:build",
"outputs": ["{options.outputPath}"],
"options": {
"uiFramework": "@storybook/web-components",
"outputPath": "dist/storybook/ui",
"config": {
"configFolder": "libs/ui/.storybook"
}
},
"configurations": {
"ci": {
"quiet": true
}
}
}
For Angular projects
This is the default configuration for Angular projects using Storybook. You can see that it uses the native @storybook/angular:build-storybook
executor. You can read more about the configuration options at the relevant Storybook documentation page.
"build-storybook": {
"executor": "@storybook/angular:build-storybook",
"outputs": ["{options.outputDir}"],
"options": {
"outputDir": "dist/storybook/ngapp",
"configDir": "libs/ui/.storybook",
"browserTarget": "ui:build",
"compodoc": false
},
"configurations": {
"ci": {
"quiet": true
}
}
}