Skip to content

Latest commit

 

History

History
45 lines (34 loc) · 5.21 KB

angular.mdx

File metadata and controls

45 lines (34 loc) · 5.21 KB
Raw

  • Add the --type angular flag to the installation command to set up Storybook manually:

    npx storybook init --type angular

  • Storybook's CLI provides support for both Yarn and npm package managers. If you have Yarn installed in your environment but prefer to use npm as your default package manager add the --use-npm flag to your installation command. For example:

    npx storybook init --use-npm

  • Storybook supports Webpack 5 out of the box. If you're upgrading from a previous version, run the following command to enable it:

    npx storybook@next automigrate

    Check the Migration Guide for more information on how to set up Webpack 5.

  • If you're using the custom Storybook builder, Storybook will not automatically open a browser window or tab. It's is a known issue that we plan to fix in future releases.

  • When adding Storybook to your Angular project, check if you're running the install command from the root directory. Or in a monorepo environment inside the directory where the angular.json file is located.

  • If you need further customization to the Storybook builder configuration, you can use the following table as a reference:

Configuration element Description
"browserTarget" Build target to be served using the following format.
"example-project:builder:config"
"tsConfig" Location of the TypeScript configuration file, relative to the current workspace.
"tsConfig": "./tsconfig.json".
"port" Port used by Storybook.
"port": 6006
"host" Set up a custom host for Storybook.
"host": "http://my-custom-host"
"configDir" Storybook configuration directory location.
"configDir": ".storybook"
"https" Starts Storybook with HTTPS enabled.
"https": true
Requires custom certificate information.
"sslCa" Provides an SSL certificate authority.
"sslCa": "your-custom-certificate-authority"
Optional usage with "https"
"sslCert" Provides an SSL certificate.
"sslCert": "your-custom-certificate"
Required for https
"sslKey" Provides an SSL key to serve Storybook.
"sslKey": "your-ssl-key"
"smokeTest" Exit Storybook after successful start.
"smokeTest": true
"ci" Starts Storybook in CI mode (skips interactive prompts and will not open browser window).
"ci": true
"quiet" Filters Storybook verbose build output.
"quiet": true
"docsMode" Starts Storybook in documentation mode.
"docsMode": true
"styles" Provide the location of the application's styles to be used with Storybook.
"styles": ["src/styles.css", "src/styles.scss"]
"stylePreprocessorOptions" Provides further customization for style preprocessors resolved to the workspace root.
"stylePreprocessorOptions": { "includePaths": ["src/styles"] }
  • For other installation issues, check the Angular README for additional instructions.