miel.truyen/nx
1
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

docs(misc): add x-priority flag for generators and executors (#14336)

Browse Source
This commit is contained in:
Katerina Skroumpelou 2023-01-13 15:14:36 +02:00 committed by GitHub
parent 46b10c2e20
commit abfa8640b2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
22 changed files with 127 additions and 178 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
docs/generated/packages/angular/generators/storybook-configuration.json
View File

@ -15,25 +15,29 @@
"description": "Project for which to generate Storybook configuration.",
"$default": { "$source": "argv", "index": 0 },
"x-prompt": "For which project do you want to generate Storybook configuration?",
"x-dropdown": "projects"
"x-dropdown": "projects",
"x-priority": "important"
},
"configureCypress": {
"type": "boolean",
"description": "Specifies whether to configure Cypress or not.",
"x-prompt": "Configure a Cypress e2e app to run against the storybook instance?",
"default": true
"default": true,
"x-priority": "important"
},
"generateStories": {
"type": "boolean",
"description": "Specifies whether to automatically generate `*.stories.ts` files for components declared in this project or not.",
"x-prompt": "Automatically generate *.stories.ts files for components declared in this project?",
"default": true
"default": true,
"x-priority": "important"
},
"generateCypressSpecs": {
"type": "boolean",
"description": "Specifies whether to automatically generate test files in the generated Cypress e2e app.",
"x-prompt": "Automatically generate test files in the generated Cypress e2e app?",
"default": true
"default": true,
"x-priority": "important"
},
"cypressDirectory": {
"type": "string",
@ -48,7 +52,8 @@
"tsConfiguration": {
"type": "boolean",
"description": "Configure your project with TypeScript. Generate main.ts and preview.ts files, instead of main.js and preview.js.",
"default": false
"default": false,
"x-priority": "important"
},
"skipFormat": {
"description": "Skip formatting files.",

15
docs/generated/packages/react/generators/storybook-configuration.json
View File

@ -15,25 +15,29 @@
"description": "Project for which to generate Storybook configuration.",
"$default": { "$source": "argv", "index": 0 },
"x-prompt": "For which project do you want to generate Storybook configuration?",
"x-dropdown": "projects"
"x-dropdown": "projects",
"x-priority": "important"
},
"configureCypress": {
"type": "boolean",
"description": "Run the cypress-configure generator.",
"x-prompt": "Configure a cypress e2e app to run against the storybook instance?",
"default": true
"default": true,
"x-priority": "important"
},
"generateStories": {
"type": "boolean",
"description": "Automatically generate `*.stories.ts` files for components declared in this project?",
"x-prompt": "Automatically generate *.stories.ts files for components declared in this project?",
"default": true
"default": true,
"x-priority": "important"
},
"generateCypressSpecs": {
"type": "boolean",
"description": "Automatically generate test files in the Cypress E2E app generated by the `cypress-configure` generator.",
"x-prompt": "Automatically generate test files in the Cypress E2E app generated by the cypress-configure generator?",
"default": true
"default": true,
"x-priority": "important"
},
"cypressDirectory": {
"type": "string",
@ -77,7 +81,8 @@
},
"bundler": {
"description": "The Storybook builder to use.",
"enum": ["vite", "webpack"]
"enum": ["vite", "webpack"],
"x-priority": "important"
}
},
"required": ["name"],

29
docs/generated/packages/storybook/executors/build.json
View File

@ -11,7 +11,7 @@
"presets": [
{
"name": "Default minimum setup",
"keys": ["uiFramework", "outputPath", "config"]
"keys": ["uiFramework", "outputDir", "configDir"]
}
],
"properties": {
@ -27,7 +27,7 @@
"@storybook/svelte"
],
"default": "@storybook/react",
"hidden": true
"x-priority": "important"
},
"outputDir": {
"type": "string",
@ -76,26 +76,6 @@
}
}
},
"config": {
"type": "object",
"description": "`.storybook` file configuration",
"properties": {
"configFolder": {
"type": "string",
"description": "Directory where to load Storybook configurations from."
},
"pluginPath": {
"type": "string",
"description": "Path to storybook `plugin.js` file."
},
"configPath": {
"type": "string",
"description": "Path to storybook `preview.js` file."
},
"srcRoot": { "type": "string", "description": "Project source path." }
},
"x-deprecated": "Prefer to use configDir to set the Storybook configuration directory."
},
"docsMode": {
"type": "boolean",
"description": "Build a documentation-only site using addon-docs.",
@ -110,7 +90,8 @@
"configDir": {
"type": "string",
"description": "Directory where to load Storybook configurations from.",
"x-completion-type": "directory"
"x-completion-type": "directory",
"x-priority": "important"
},
"loglevel": {
"type": "string",
@ -159,7 +140,7 @@
},
"additionalProperties": true,
"required": ["uiFramework", "configDir"],
"examplesFile": "`project.json`:\n\n```json\n//...\n\"ui\": {\n \"targets\": {\n //...\n \"build-storybook\": {\n \"executor\": \"@nrwl/storybook:build\",\n \"outputs\": [\"{options.outputPath}\"],\n \"options\": {\n \"uiFramework\": \"@storybook/react\",\n \"outputPath\": \"dist/storybook/ui\",\n \"config\": {\n \"configFolder\": \"libs/ui/.storybook\"\n }\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n }\n}\n```\n\n```bash\nnx run ui:build-storybook\n```\n\n## Examples\n\n### For non-Angular projects\n\n{% tabs %}\n{% tab label=\"Setting the uiFramework\" %}\n\nYou 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.\n\n```json\n\"build-storybook\": {\n \"executor\": \"@nrwl/storybook:build\",\n \"outputs\": [\"{options.outputPath}\"],\n \"options\": {\n \"uiFramework\": \"@storybook/web-components\",\n \"outputPath\": \"dist/storybook/ui\",\n \"config\": {\n \"configFolder\": \"libs/ui/.storybook\"\n }\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n{% tab label=\"Working in docsMode\" %}\n\nYou can work in docs mode, building a documentation-only site, by setting the `docsMode` option to `true` and using the `@storybook/addon-docs` addon.\n\nRead more on the [Storybook documentation page for `addon-docs`](https://storybook.js.org/addons/@storybook/addon-docs).\n\n```json\n\"storybook\": {\n \"executor\": \"@nrwl/storybook:build\",\n \"options\": {\n \"uiFramework\": \"@storybook/react\",\n \"port\": 4400,\n \"config\": {\n \"configFolder\": \"libs/ui/.storybook\"\n },\n \"docsMode\": true\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n\n{% /tabs %}\n\n### For Angular projects\n\n{% tabs %}\n{% tab label=\"Default configuration\" %}\n\nThis 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](https://storybook.js.org/docs/angular/get-started/install).\n\n```json\n\"build-storybook\": {\n \"executor\": \"@storybook/angular:build-storybook\",\n \"outputs\": [\"{options.outputDir}\"],\n \"options\": {\n \"outputDir\": \"dist/storybook/ngapp\",\n \"configDir\": \"libs/ui/.storybook\",\n \"browserTarget\": \"ui:build\",\n \"compodoc\": false\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n{% tab label=\"Changing the browserTarget\" %}\n\nYou can set the [`browserTarget`](/packages/storybook/documents/angular-browser-target) to use `build-storybook` as the builder. This is most useful in the cases where your project does not have a `build` target.\n\n```json\n\"build-storybook\": {\n \"executor\": \"@storybook/angular:build-storybook\",\n \"outputs\": [\"{options.outputDir}\"],\n \"options\": {\n \"outputDir\": \"dist/storybook/ngapp\",\n \"configDir\": \"libs/ui/.storybook\",\n \"browserTarget\": \"ui:build-storybook\",\n \"compodoc\": false\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n\n{% tab label=\"Adding styles\" %}\n\nYou can add paths to stylesheets to be included in the Storybook build by using the `styles` array. You can also add `stylePreprocessorOptions`, much like you would do in the Angular builder. You can read more in our guide about [styles and preprocessor options for Storybook](/packages/storybook/documents/angular-configuring-styles).\n\n```json\n\"build-storybook\": {\n \"executor\": \"@storybook/angular:build-storybook\",\n \"outputs\": [\"{options.outputDir}\"],\n \"options\": {\n \"outputDir\": \"dist/storybook/ngapp\",\n \"configDir\": \"libs/ui/.storybook\",\n \"browserTarget\": \"ui:build-storybook\",\n \"compodoc\": false,\n \"styles\": [\"some-styles.css\"],\n \"stylePreprocessorOptions\": {\n \"includePaths\": [\"some-style-paths\"]\n }\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n\n{% /tabs %}\n"
"examplesFile": "`project.json`:\n\n```json\n//...\n\"ui\": {\n \"targets\": {\n //...\n \"build-storybook\": {\n \"executor\": \"@nrwl/storybook:build\",\n \"outputs\": [\"{options.outputDir}\"],\n \"options\": {\n \"uiFramework\": \"@storybook/react\",\n \"outputDir\": \"dist/storybook/ui\",\n \"configDir\": \"libs/ui/.storybook\"\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n }\n}\n```\n\n```bash\nnx run ui:build-storybook\n```\n\n## Examples\n\n### For non-Angular projects\n\n{% tabs %}\n{% tab label=\"Setting the uiFramework\" %}\n\nYou 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.\n\n```json\n\"build-storybook\": {\n \"executor\": \"@nrwl/storybook:build\",\n \"outputs\": [\"{options.outputDir}\"],\n \"options\": {\n \"uiFramework\": \"@storybook/web-components\",\n \"outputDir\": \"dist/storybook/ui\",\n \"configDir\": \"libs/ui/.storybook\"\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n{% tab label=\"Working in docsMode\" %}\n\nYou can work in docs mode, building a documentation-only site, by setting the `docsMode` option to `true` and using the `@storybook/addon-docs` addon.\n\nRead more on the [Storybook documentation page for `addon-docs`](https://storybook.js.org/addons/@storybook/addon-docs).\n\n```json\n\"storybook\": {\n \"executor\": \"@nrwl/storybook:build\",\n \"options\": {\n \"uiFramework\": \"@storybook/react\",\n \"port\": 4400,\n \"configDir\": \"libs/ui/.storybook\",\n \"docsMode\": true\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n\n{% /tabs %}\n\n### For Angular projects\n\n{% tabs %}\n{% tab label=\"Default configuration\" %}\n\nThis 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](https://storybook.js.org/docs/angular/get-started/install).\n\n```json\n\"build-storybook\": {\n \"executor\": \"@storybook/angular:build-storybook\",\n \"outputs\": [\"{options.outputDir}\"],\n \"options\": {\n \"outputDir\": \"dist/storybook/ngapp\",\n \"configDir\": \"libs/ui/.storybook\",\n \"browserTarget\": \"ui:build\",\n \"compodoc\": false\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n{% tab label=\"Changing the browserTarget\" %}\n\nYou can set the [`browserTarget`](/packages/storybook/documents/angular-browser-target) to use `build-storybook` as the builder. This is most useful in the cases where your project does not have a `build` target.\n\n```json\n\"build-storybook\": {\n \"executor\": \"@storybook/angular:build-storybook\",\n \"outputs\": [\"{options.outputDir}\"],\n \"options\": {\n \"outputDir\": \"dist/storybook/ngapp\",\n \"configDir\": \"libs/ui/.storybook\",\n \"browserTarget\": \"ui:build-storybook\",\n \"compodoc\": false\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n\n{% tab label=\"Adding styles\" %}\n\nYou can add paths to stylesheets to be included in the Storybook build by using the `styles` array. You can also add `stylePreprocessorOptions`, much like you would do in the Angular builder. You can read more in our guide about [styles and preprocessor options for Storybook](/packages/storybook/documents/angular-configuring-styles).\n\n```json\n\"build-storybook\": {\n \"executor\": \"@storybook/angular:build-storybook\",\n \"outputs\": [\"{options.outputDir}\"],\n \"options\": {\n \"outputDir\": \"dist/storybook/ngapp\",\n \"configDir\": \"libs/ui/.storybook\",\n \"browserTarget\": \"ui:build-storybook\",\n \"compodoc\": false,\n \"styles\": [\"some-styles.css\"],\n \"stylePreprocessorOptions\": {\n \"includePaths\": [\"some-style-paths\"]\n }\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n\n{% /tabs %}\n"
},
"description": "Build Storybook.",
"aliases": [],

33
docs/generated/packages/storybook/executors/storybook.json
View File

@ -11,7 +11,7 @@
"presets": [
{
"name": "Default minimum setup",
"keys": ["uiFramework", "port", "config"]
"keys": ["uiFramework", "port", "configDir"]
}
],
"properties": {
@ -27,7 +27,7 @@
"@storybook/svelte"
],
"default": "@storybook/react",
"hidden": true
"x-priority": "important"
},
"port": {
"type": "number",
@ -49,7 +49,8 @@
"configDir": {
"type": "string",
"description": "Directory where to load Storybook configurations from.",
"x-completion-type": "directory"
"x-completion-type": "directory",
"x-priority": "important"
},
"https": {
"type": "boolean",
@ -80,30 +81,6 @@
"description": "Starts Storybook in documentation mode. Learn more about it : https://storybook.js.org/docs/react/writing-docs/build-documentation#preview-storybooks-documentation.",
"default": false
},
"config": {
"type": "object",
"description": ".storybook configuration.",
"properties": {
"configFolder": {
"type": "string",
"description": "Directory where to load Storybook configurations from."
},
"pluginPath": {
"type": "string",
"description": "Path to storybook plugin.js file."
},
"configPath": {
"type": "string",
"description": "Path to storybook preview.js file."
},
"babelrcPath": {
"type": "string",
"description": "Path to storybook .babelrc file."
},
"srcRoot": { "type": "string", "description": "Project source path." }
},
"x-deprecated": "Prefer to use configDir to set the Storybook configuration directory."
},
"docsMode": {
"type": "boolean",
"description": "Starts Storybook in documentation mode. Learn more about it : https://storybook.js.org/docs/react/writing-docs/build-documentation#preview-storybooks-documentation.",
@ -113,7 +90,7 @@
"additionalProperties": true,
"definitions": {},
"required": ["uiFramework", "configDir"],
"examplesFile": "`project.json`:\n\n```json\n//...\n\"ui\": {\n \"targets\": {\n //...\n \"storybook\": {\n \"executor\": \"@nrwl/storybook:storybook\",\n \"options\": {\n \"uiFramework\": \"@storybook/react\",\n \"port\": 4400,\n \"config\": {\n \"configFolder\": \"libs/ui/.storybook\"\n }\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n },\n }\n}\n```\n\n```bash\nnx run ui:storybook\n```\n\n## Examples\n\n### For non-Angular projects\n\n{% tabs %}\n{% tab label=\"Setting the uiFramework\" %}\n\nYou 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.\n\n```json\n\"storybook\": {\n \"executor\": \"@nrwl/storybook:storybook\",\n \"options\": {\n \"uiFramework\": \"@storybook/web-components\",\n \"port\": 4400,\n \"config\": {\n \"configFolder\": \"libs/ui/.storybook\"\n }\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n{% tab label=\"Working in docsMode\" %}\n\nYou can work in docs mode, building a documentation-only site, by setting the `docsMode` option to `true` and using the `@storybook/addon-docs` addon.\n\nRead more on the [Storybook documentation page for `addon-docs`](https://storybook.js.org/addons/@storybook/addon-docs).\n\n```json\n\"storybook\": {\n \"executor\": \"@nrwl/storybook:storybook\",\n \"options\": {\n \"uiFramework\": \"@storybook/react\",\n \"port\": 4400,\n \"config\": {\n \"configFolder\": \"libs/ui/.storybook\"\n },\n \"docsMode\": true\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n\n{% /tabs %}\n\n### For Angular projects\n\n{% tabs %}\n{% tab label=\"Default configuration\" %}\n\nThis is the default configuration for Angular projects using Storybook. You can see that it uses the native `@storybook/angular:start-storybook` executor. You can read more about the configuration options at the relevant [Storybook documentation page](https://storybook.js.org/docs/angular/get-started/install).\n\n```json\n\"storybook\": {\n \"executor\": \"@storybook/angular:start-storybook\",\n \"options\": {\n \"port\": 4400,\n \"configDir\": \"libs/ui/.storybook\",\n \"browserTarget\": \"ui:build\",\n \"compodoc\": false\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n},\n```\n\n{% /tab %}\n{% tab label=\"Changing the browserTarget\" %}\n\nYou can set the [`browserTarget`](/packages/storybook/documents/angular-browser-target) to use `build-storybook` as the builder. This is most useful in the cases where your project does not have a `build` target.\n\n```json\n\"storybook\": {\n \"executor\": \"@storybook/angular:start-storybook\",\n \"options\": {\n \"port\": 4400,\n \"configDir\": \"libs/ui/.storybook\",\n \"browserTarget\": \"ui:build-storybook\",\n \"compodoc\": false\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n},\n```\n\n{% /tab %}\n\n{% tab label=\"Adding styles\" %}\n\nYou can add paths to stylesheets to be included in the Storybook build by using the `styles` array. You can also add `stylePreprocessorOptions`, much like you would do in the Angular builder. You can read more in our guide about [styles and preprocessor options for Storybook](/packages/storybook/documents/angular-configuring-styles).\n\n```json\n\"storybook\": {\n \"executor\": \"@storybook/angular:start-storybook\",\n \"options\": {\n \"port\": 4400,\n \"configDir\": \"libs/ui/.storybook\",\n \"browserTarget\": \"ui:build\",\n \"compodoc\": false,\n \"styles\": [\"some-styles.css\"],\n \"stylePreprocessorOptions\": {\n \"includePaths\": [\"some-style-paths\"]\n }\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n},\n```\n\n{% /tab %}\n\n{% /tabs %}\n"
"examplesFile": "`project.json`:\n\n```json\n//...\n\"ui\": {\n \"targets\": {\n //...\n \"storybook\": {\n \"executor\": \"@nrwl/storybook:storybook\",\n \"options\": {\n \"uiFramework\": \"@storybook/react\",\n \"port\": 4400,\n \"configDir\": \"libs/ui/.storybook\"\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n },\n }\n}\n```\n\n```bash\nnx run ui:storybook\n```\n\n## Examples\n\n### For non-Angular projects\n\n{% tabs %}\n{% tab label=\"Setting the uiFramework\" %}\n\nYou 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.\n\n```json\n\"storybook\": {\n \"executor\": \"@nrwl/storybook:storybook\",\n \"options\": {\n \"uiFramework\": \"@storybook/web-components\",\n \"port\": 4400,\n \"configDir\": \"libs/ui/.storybook\"\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n{% tab label=\"Working in docsMode\" %}\n\nYou can work in docs mode, building a documentation-only site, by setting the `docsMode` option to `true` and using the `@storybook/addon-docs` addon.\n\nRead more on the [Storybook documentation page for `addon-docs`](https://storybook.js.org/addons/@storybook/addon-docs).\n\n```json\n\"storybook\": {\n \"executor\": \"@nrwl/storybook:storybook\",\n \"options\": {\n \"uiFramework\": \"@storybook/react\",\n \"port\": 4400,\n \"configDir\": \"libs/ui/.storybook\",\n \"docsMode\": true\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n}\n```\n\n{% /tab %}\n\n{% /tabs %}\n\n### For Angular projects\n\n{% tabs %}\n{% tab label=\"Default configuration\" %}\n\nThis is the default configuration for Angular projects using Storybook. You can see that it uses the native `@storybook/angular:start-storybook` executor. You can read more about the configuration options at the relevant [Storybook documentation page](https://storybook.js.org/docs/angular/get-started/install).\n\n```json\n\"storybook\": {\n \"executor\": \"@storybook/angular:start-storybook\",\n \"options\": {\n \"port\": 4400,\n \"configDir\": \"libs/ui/.storybook\",\n \"browserTarget\": \"ui:build\",\n \"compodoc\": false\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n},\n```\n\n{% /tab %}\n{% tab label=\"Changing the browserTarget\" %}\n\nYou can set the [`browserTarget`](/packages/storybook/documents/angular-browser-target) to use `build-storybook` as the builder. This is most useful in the cases where your project does not have a `build` target.\n\n```json\n\"storybook\": {\n \"executor\": \"@storybook/angular:start-storybook\",\n \"options\": {\n \"port\": 4400,\n \"configDir\": \"libs/ui/.storybook\",\n \"browserTarget\": \"ui:build-storybook\",\n \"compodoc\": false\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n},\n```\n\n{% /tab %}\n\n{% tab label=\"Adding styles\" %}\n\nYou can add paths to stylesheets to be included in the Storybook build by using the `styles` array. You can also add `stylePreprocessorOptions`, much like you would do in the Angular builder. You can read more in our guide about [styles and preprocessor options for Storybook](/packages/storybook/documents/angular-configuring-styles).\n\n```json\n\"storybook\": {\n \"executor\": \"@storybook/angular:start-storybook\",\n \"options\": {\n \"port\": 4400,\n \"configDir\": \"libs/ui/.storybook\",\n \"browserTarget\": \"ui:build\",\n \"compodoc\": false,\n \"styles\": [\"some-styles.css\"],\n \"stylePreprocessorOptions\": {\n \"includePaths\": [\"some-style-paths\"]\n }\n },\n \"configurations\": {\n \"ci\": {\n \"quiet\": true\n }\n }\n},\n```\n\n{% /tab %}\n\n{% /tabs %}\n"
},
"description": "Serve Storybook.",
"aliases": [],

15
docs/generated/packages/storybook/generators/configuration.json
View File

@ -15,7 +15,8 @@
"description": "Project for which to generate Storybook configuration.",
"$default": { "$source": "argv", "index": 0 },
"x-prompt": "For which project do you want to generate Storybook configuration?",
"x-dropdown": "projects"
"x-dropdown": "projects",
"x-priority": "important"
},
"uiFramework": {
"type": "string",
@ -30,12 +31,14 @@
"@storybook/vue3",
"@storybook/svelte"
],
"x-prompt": "What UI framework plugin should storybook use?"
"x-prompt": "What UI framework plugin should storybook use?",
"x-priority": "important"
},
"configureCypress": {
"type": "boolean",
"description": "Run the cypress-configure generator.",
"x-prompt": "Configure a cypress e2e app to run against the storybook instance?"
"x-prompt": "Configure a cypress e2e app to run against the storybook instance?",
"x-priority": "important"
},
"cypressDirectory": {
"type": "string",
@ -55,7 +58,8 @@
"tsConfiguration": {
"type": "boolean",
"description": "Configure your project with TypeScript. Generate main.ts and preview.ts files, instead of main.js and preview.js.",
"default": false
"default": false,
"x-priority": "important"
},
"standaloneConfig": {
"description": "Split the project configuration into `<projectRoot>/project.json` rather than including it inside `workspace.json`.",
@ -70,7 +74,8 @@
"type": "string",
"enum": ["vite", "webpack"],
"x-prompt": "Which Storybook builder do you want to use?",
"default": "webpack"
"default": "webpack",
"x-priority": "important"
}
},
"required": ["name"],

3
docs/generated/packages/storybook/generators/cypress-project.json
View File

@ -15,7 +15,8 @@
"description": "Project for which to generate the cypress E2E app.",
"$default": { "$source": "argv", "index": 0 },
"x-prompt": "For which project do you want to generate the Cypress E2E app?",
"x-dropdown": "projects"
"x-dropdown": "projects",
"x-priority": "important"
},
"js": {
"type": "boolean",

6
docs/generated/packages/storybook/generators/init.json
View File

@ -21,14 +21,16 @@
"@storybook/svelte",
"@storybook/react-native"
],
"x-prompt": "What UI framework plugin should storybook use?"
"x-prompt": "What UI framework plugin should storybook use?",
"x-priority": "important"
},
"bundler": {
"description": "The bundler to use.",
"type": "string",
"enum": ["vite", "webpack"],
"x-prompt": "Which bundler do you want to use?",
"default": "webpack"
"default": "webpack",
"x-priority": "important"
}
},
"presets": []

3
docs/generated/packages/vite/executors/build.json
View File

@ -13,7 +13,8 @@
"outputPath": {
"type": "string",
"description": "The output path of the generated files.",
"x-completion-type": "directory"
"x-completion-type": "directory",
"x-priority": "important"
},
"base": {
"type": "string",

9
docs/generated/packages/vite/executors/dev-server.json
View File

@ -15,14 +15,19 @@
"properties": {
"buildTarget": {
"type": "string",
"description": "Target which builds the application. Only used to retrieve the configuration as the dev-server does not build the code."
"description": "Target which builds the application. Only used to retrieve the configuration as the dev-server does not build the code.",
"x-priority": "important"
},
"proxyConfig": {
"type": "string",
"description": "Path to the proxy configuration file.",
"x-completion-type": "file"
},
"port": { "type": "number", "description": "Port to listen on." },
"port": {
"type": "number",
"description": "Port to listen on.",
"x-priority": "important"
},
"host": {
"description": "Specify which IP addresses the server should listen on.",
"oneOf": [{ "type": "boolean" }, { "type": "string" }]

9
docs/generated/packages/vite/executors/test.json
View File

@ -28,7 +28,8 @@
"type": "string",
"enum": ["test", "benchmark", "typecheck"],
"default": "test",
"description": "The mode that vitest will run on"
"description": "The mode that vitest will run on",
"x-priority": "important"
},
"watch": {
"type": "boolean",
@ -44,12 +45,14 @@
"type": "boolean",
"default": false,
"alias": "u",
"description": "Update snapshots"
"description": "Update snapshots",
"x-priority": "important"
},
"coverage": {
"type": "boolean",
"default": false,
"description": "Enable coverage report"
"description": "Enable coverage report",
"x-priority": "important"
},
"reportsDirectory": {
"type": "string",

15
packages/angular/src/generators/storybook-configuration/schema.json
View File

@ -15,25 +15,29 @@
"index": 0
},
"x-prompt": "For which project do you want to generate Storybook configuration?",
"x-dropdown": "projects"
"x-dropdown": "projects",
"x-priority": "important"
},
"configureCypress": {
"type": "boolean",
"description": "Specifies whether to configure Cypress or not.",
"x-prompt": "Configure a Cypress e2e app to run against the storybook instance?",
"default": true
"default": true,
"x-priority": "important"
},
"generateStories": {
"type": "boolean",
"description": "Specifies whether to automatically generate `*.stories.ts` files for components declared in this project or not.",
"x-prompt": "Automatically generate *.stories.ts files for components declared in this project?",
"default": true
"default": true,
"x-priority": "important"
},
"generateCypressSpecs": {
"type": "boolean",
"description": "Specifies whether to automatically generate test files in the generated Cypress e2e app.",
"x-prompt": "Automatically generate test files in the generated Cypress e2e app?",
"default": true
"default": true,
"x-priority": "important"
},
"cypressDirectory": {
"type": "string",
@ -48,7 +52,8 @@
"tsConfiguration": {
"type": "boolean",
"description": "Configure your project with TypeScript. Generate main.ts and preview.ts files, instead of main.js and preview.js.",
"default": false
"default": false,
"x-priority": "important"
},
"skipFormat": {
"description": "Skip formatting files.",

15
packages/react/src/generators/storybook-configuration/schema.json
View File

@ -15,25 +15,29 @@
"index": 0
},
"x-prompt": "For which project do you want to generate Storybook configuration?",
"x-dropdown": "projects"
"x-dropdown": "projects",
"x-priority": "important"
},
"configureCypress": {
"type": "boolean",
"description": "Run the cypress-configure generator.",
"x-prompt": "Configure a cypress e2e app to run against the storybook instance?",
"default": true
"default": true,
"x-priority": "important"
},
"generateStories": {
"type": "boolean",
"description": "Automatically generate `*.stories.ts` files for components declared in this project?",
"x-prompt": "Automatically generate *.stories.ts files for components declared in this project?",
"default": true
"default": true,
"x-priority": "important"
},
"generateCypressSpecs": {
"type": "boolean",
"description": "Automatically generate test files in the Cypress E2E app generated by the `cypress-configure` generator.",
"x-prompt": "Automatically generate test files in the Cypress E2E app generated by the cypress-configure generator?",
"default": true
"default": true,
"x-priority": "important"
},
"cypressDirectory": {
"type": "string",
@ -80,7 +84,8 @@
},
"bundler": {
"description": "The Storybook builder to use.",
"enum": ["vite", "webpack"]
"enum": ["vite", "webpack"],
"x-priority": "important"
}
},
"required": ["name"],

20
packages/storybook/docs/build-storybook-executor-examples.md
View File

@ -7,13 +7,11 @@
//...
"build-storybook": {
"executor": "@nrwl/storybook:build",
"outputs": ["{options.outputPath}"],
"outputs": ["{options.outputDir}"],
"options": {
"uiFramework": "@storybook/react",
"outputPath": "dist/storybook/ui",
"config": {
"configFolder": "libs/ui/.storybook"
}
"outputDir": "dist/storybook/ui",
"configDir": "libs/ui/.storybook"
},
"configurations": {
"ci": {
@ -40,13 +38,11 @@ You can change the `uiFramework` option, to correspond to the framework you are
```json
"build-storybook": {
"executor": "@nrwl/storybook:build",
"outputs": ["{options.outputPath}"],
"outputs": ["{options.outputDir}"],
"options": {
"uiFramework": "@storybook/web-components",
"outputPath": "dist/storybook/ui",
"config": {
"configFolder": "libs/ui/.storybook"
}
"outputDir": "dist/storybook/ui",
"configDir": "libs/ui/.storybook"
},
"configurations": {
"ci": {
@ -69,9 +65,7 @@ Read more on the [Storybook documentation page for `addon-docs`](https://storybo
"options": {
"uiFramework": "@storybook/react",
"port": 4400,
"config": {
"configFolder": "libs/ui/.storybook"
},
"configDir": "libs/ui/.storybook",
"docsMode": true
},
"configurations": {

12
packages/storybook/docs/storybook-executor-examples.md
View File

@ -10,9 +10,7 @@
"options": {
"uiFramework": "@storybook/react",
"port": 4400,
"config": {
"configFolder": "libs/ui/.storybook"
}
"configDir": "libs/ui/.storybook"
},
"configurations": {
"ci": {
@ -43,9 +41,7 @@ You can change the `uiFramework` option, to correspond to the framework you are
"options": {
"uiFramework": "@storybook/web-components",
"port": 4400,
"config": {
"configFolder": "libs/ui/.storybook"
}
"configDir": "libs/ui/.storybook"
},
"configurations": {
"ci": {
@ -68,9 +64,7 @@ Read more on the [Storybook documentation page for `addon-docs`](https://storybo
"options": {
"uiFramework": "@storybook/react",
"port": 4400,
"config": {
"configFolder": "libs/ui/.storybook"
},
"configDir": "libs/ui/.storybook",
"docsMode": true
},
"configurations": {

30
packages/storybook/src/executors/build-storybook/schema.json
View File

@ -8,7 +8,7 @@
"presets": [
{
"name": "Default minimum setup",
"keys": ["uiFramework", "outputPath", "config"]
"keys": ["uiFramework", "outputDir", "configDir"]
}
],
"properties": {
@ -24,7 +24,7 @@
"@storybook/svelte"
],
"default": "@storybook/react",
"hidden": true
"x-priority": "important"
},
"outputDir": {
"type": "string",
@ -51,29 +51,6 @@
}
}
},
"config": {
"type": "object",
"description": "`.storybook` file configuration",
"properties": {
"configFolder": {
"type": "string",
"description": "Directory where to load Storybook configurations from."
},
"pluginPath": {
"type": "string",
"description": "Path to storybook `plugin.js` file."
},
"configPath": {
"type": "string",
"description": "Path to storybook `preview.js` file."
},
"srcRoot": {
"type": "string",
"description": "Project source path."
}
},
"x-deprecated": "Prefer to use configDir to set the Storybook configuration directory."
},
"docsMode": {
"type": "boolean",
"description": "Build a documentation-only site using addon-docs.",
@ -90,7 +67,8 @@
"configDir": {
"type": "string",
"description": "Directory where to load Storybook configurations from.",
"x-completion-type": "directory"
"x-completion-type": "directory",
"x-priority": "important"
},
"loglevel": {
"type": "string",

34
packages/storybook/src/executors/storybook/schema.json
View File

@ -8,7 +8,7 @@
"presets": [
{
"name": "Default minimum setup",
"keys": ["uiFramework", "port", "config"]
"keys": ["uiFramework", "port", "configDir"]
}
],
"properties": {
@ -24,7 +24,7 @@
"@storybook/svelte"
],
"default": "@storybook/react",
"hidden": true
"x-priority": "important"
},
"port": {
"type": "number",
@ -51,7 +51,8 @@
"configDir": {
"type": "string",
"description": "Directory where to load Storybook configurations from.",
"x-completion-type": "directory"
"x-completion-type": "directory",
"x-priority": "important"
},
"https": {
"type": "boolean",
@ -82,33 +83,6 @@
"description": "Starts Storybook in documentation mode. Learn more about it : https://storybook.js.org/docs/react/writing-docs/build-documentation#preview-storybooks-documentation.",
"default": false
},
"config": {
"type": "object",
"description": ".storybook configuration.",
"properties": {
"configFolder": {
"type": "string",
"description": "Directory where to load Storybook configurations from."
},
"pluginPath": {
"type": "string",
"description": "Path to storybook plugin.js file."
},
"configPath": {
"type": "string",
"description": "Path to storybook preview.js file."
},
"babelrcPath": {
"type": "string",
"description": "Path to storybook .babelrc file."
},
"srcRoot": {
"type": "string",
"description": "Project source path."
}
},
"x-deprecated": "Prefer to use configDir to set the Storybook configuration directory."
},
"docsMode": {
"type": "boolean",
"description": "Starts Storybook in documentation mode. Learn more about it : https://storybook.js.org/docs/react/writing-docs/build-documentation#preview-storybooks-documentation.",

15
packages/storybook/src/generators/configuration/schema.json
View File

@ -15,7 +15,8 @@
"index": 0
},
"x-prompt": "For which project do you want to generate Storybook configuration?",
"x-dropdown": "projects"
"x-dropdown": "projects",
"x-priority": "important"
},
"uiFramework": {
"type": "string",
@ -30,12 +31,14 @@
"@storybook/vue3",
"@storybook/svelte"
],
"x-prompt": "What UI framework plugin should storybook use?"
"x-prompt": "What UI framework plugin should storybook use?",
"x-priority": "important"
},
"configureCypress": {
"type": "boolean",
"description": "Run the cypress-configure generator.",
"x-prompt": "Configure a cypress e2e app to run against the storybook instance?"
"x-prompt": "Configure a cypress e2e app to run against the storybook instance?",
"x-priority": "important"
},
"cypressDirectory": {
"type": "string",
@ -55,7 +58,8 @@
"tsConfiguration": {
"type": "boolean",
"description": "Configure your project with TypeScript. Generate main.ts and preview.ts files, instead of main.js and preview.js.",
"default": false
"default": false,
"x-priority": "important"
},
"standaloneConfig": {
"description": "Split the project configuration into `<projectRoot>/project.json` rather than including it inside `workspace.json`.",
@ -70,7 +74,8 @@
"type": "string",
"enum": ["vite", "webpack"],
"x-prompt": "Which Storybook builder do you want to use?",
"default": "webpack"
"default": "webpack",
"x-priority": "important"
}
},
"required": ["name"],

3
packages/storybook/src/generators/cypress-project/schema.json
View File

@ -15,7 +15,8 @@
"index": 0
},
"x-prompt": "For which project do you want to generate the Cypress E2E app?",
"x-dropdown": "projects"
"x-dropdown": "projects",
"x-priority": "important"
},
"js": {
"type": "boolean",

6
packages/storybook/src/generators/init/schema.json
View File

@ -18,14 +18,16 @@
"@storybook/svelte",
"@storybook/react-native"
],
"x-prompt": "What UI framework plugin should storybook use?"
"x-prompt": "What UI framework plugin should storybook use?",
"x-priority": "important"
},
"bundler": {
"description": "The bundler to use.",
"type": "string",
"enum": ["vite", "webpack"],
"x-prompt": "Which bundler do you want to use?",
"default": "webpack"
"default": "webpack",
"x-priority": "important"
}
}
}

3
packages/vite/src/executors/build/schema.json
View File

@ -15,7 +15,8 @@
"outputPath": {
"type": "string",
"description": "The output path of the generated files.",
"x-completion-type": "directory"
"x-completion-type": "directory",
"x-priority": "important"
},
"base": {
"type": "string",

6
packages/vite/src/executors/dev-server/schema.json
View File

@ -18,7 +18,8 @@
"properties": {
"buildTarget": {
"type": "string",
"description": "Target which builds the application. Only used to retrieve the configuration as the dev-server does not build the code."
"description": "Target which builds the application. Only used to retrieve the configuration as the dev-server does not build the code.",
"x-priority": "important"
},
"proxyConfig": {
"type": "string",
@ -27,7 +28,8 @@
},
"port": {
"type": "number",
"description": "Port to listen on."
"description": "Port to listen on.",
"x-priority": "important"
},
"host": {
"description": "Specify which IP addresses the server should listen on.",

9
packages/vite/src/executors/test/schema.json
View File

@ -25,7 +25,8 @@
"type": "string",
"enum": ["test", "benchmark", "typecheck"],
"default": "test",
"description": "The mode that vitest will run on"
"description": "The mode that vitest will run on",
"x-priority": "important"
},
"watch": {
"type": "boolean",
@ -43,12 +44,14 @@
"type": "boolean",
"default": false,
"alias": "u",
"description": "Update snapshots"
"description": "Update snapshots",
"x-priority": "important"
},
"coverage": {
"type": "boolean",
"default": false,
"description": "Enable coverage report"
"description": "Enable coverage report",
"x-priority": "important"
},
"reportsDirectory": {
"type": "string",