Known Bugs and Solutions

Publish to Chromatic not working (with errors like cannot resolve module xyz and deprecation warning about PostCSS module)

Details

Sample runner log/console output

Chromatic CLI v5.7.0
https://www.chromatic.com/docs/cli

Authenticating with Chromatic
  → Connecting to https://index.chromatic.com
Authenticated with Chromatic
  → Using project token '************'
Retrieving git information
Retrieved git information
  → Commit '8d08ed9' on branch 'main'; found 1 baseline commit
Collecting Storybook metadata
Collected Storybook metadata
  → Storybook v6.2.5 for React; supported addons found: Actions, Backgrounds, Links, Viewport
Building your Storybook
  → Running command: story:build -- --output-dir /tmp/chromatic--2329-vMS24QbSU7RG
The CLI tried to run your story:build script, but the command failed. This indicates a problem with your Storybook. Here's what to do:

- Check the Storybook build log printed below.
- Run npm run story:build or yarn story:build yourself and make sure it outputs a valid Storybook by opening the generated index.html in your browser.
- Review the build-storybook CLI options at https://storybook.js.org/docs/configurations/cli-options/#for-build-storybook

Command failed with exit code 1: npm run --silent story:build -- --output-dir /tmp/chromatic--2329-vMS24QbSU7RG

ℹ Storybook build output:
/home/runner/work/telestion-client/telestion-client/build-storybook.log

info @storybook/react v6.2.5
info 
info => Cleaning outputDir: /tmp/chromatic--2329-vMS24QbSU7RG
info => Loading presets
WARN unable to find package.json for @rollup/plugin-node-resolve
WARN unable to find package.json for rollup
WARN unable to find package.json for rollup-plugin-dts
WARN unable to find package.json for rollup-plugin-terser
info => Using prebuilt manager
info => Compiling preview..
info => Loading 1 config file in "/home/runner/work/telestion-client/telestion-client/.storybook"
info => Loading 7 other files in "/home/runner/work/telestion-client/telestion-client/.storybook"
info => Adding stories defined in "/home/runner/work/telestion-client/telestion-client/.storybook/main.js"
info => Using implicit CSS loaders
WARN Storybook support for Create React App is now a separate preset.
WARN To use the new preset, install `@storybook/preset-create-react-app` and add it to the list of `addons` in your `.storybook/main.js` config file.
WARN The built-in preset has been disabled in Storybook 6.0.
info => Using default Webpack4 setup
(node:2371) DeprecationWarning: Default PostCSS plugins are deprecated. When switching to '@storybook/addon-postcss',
you will need to add your own plugins, such as 'postcss-flexbugs-fixes' and 'autoprefixer'.
See https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#deprecated-default-postcss-plugins for details.
(Use `node --trace-deprecation ...` to show where the warning was created)
ERR! => Failed to build the preview
ERR! Module not found: Error: Can't resolve '@storybook/addon-docs/blocks' in '/home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/src/components/header'
ERR! ModuleNotFoundError: Module not found: Error: Can't resolve '@storybook/addon-docs/blocks' in '/home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/src/components/header'
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/webpack/lib/Compilation.js:925:10
  → Command failed: story:build -- --output-dir /tmp/chromatic--2329-vMS24QbSU7RG
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/webpack/lib/NormalModuleFactory.js:401:22
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/webpack/lib/NormalModuleFactory.js:130:21
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/webpack/lib/NormalModuleFactory.js:224:22
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/neo-async/async.js:2830:7
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/neo-async/async.js:6877:13
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/webpack/lib/NormalModuleFactory.js:214:25
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/enhanced-resolve/lib/Resolver.js:213:14
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/enhanced-resolve/lib/Resolver.js:285:5
ERR!     at eval (eval at create (/home/runner/work/telestion-client/telestion-client/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:44:7
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/enhanced-resolve/lib/Resolver.js:285:5
ERR!     at eval (eval at create (/home/runner/work/telestion-client/telestion-client/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/enhanced-resolve/lib/Resolver.js:285:5
ERR!     at eval (eval at create (/home/runner/work/telestion-client/telestion-client/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:27:1)
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:67:43
ERR!  ModuleNotFoundError: Module not found: Error: Can't resolve '@storybook/addon-docs/blocks' in '/home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/src/components/header'
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/webpack/lib/Compilation.js:925:10
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/webpack/lib/NormalModuleFactory.js:401:22
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/webpack/lib/NormalModuleFactory.js:130:21
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/webpack/lib/NormalModuleFactory.js:224:22
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/neo-async/async.js:2830:7
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/neo-async/async.js:6877:13
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/webpack/lib/NormalModuleFactory.js:214:25
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/enhanced-resolve/lib/Resolver.js:213:14
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/enhanced-resolve/lib/Resolver.js:285:5
ERR!     at eval (eval at create (/home/runner/work/telestion-client/telestion-client/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:44:7
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/enhanced-resolve/lib/Resolver.js:285:5
ERR!     at eval (eval at create (/home/runner/work/telestion-client/telestion-client/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/enhanced-resolve/lib/Resolver.js:285:5
ERR!     at eval (eval at create (/home/runner/work/telestion-client/telestion-client/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:27:1)
ERR!     at /home/runner/work/telestion-client/telestion-client/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:67:43
ERR! resolve '@storybook/addon-docs/blocks' in '/home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/src/components/header'
ERR!   Parsed request is a module
ERR!   using description file: /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/package.json (relative path: ./src/components/header)
ERR!     Field 'browser' doesn't contain a valid alias configuration
ERR!     resolve as module
ERR!       /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/src/components/header/node_modules doesn't exist or is not a directory
ERR!       /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/src/components/node_modules doesn't exist or is not a directory
ERR!       /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/src/node_modules doesn't exist or is not a directory
ERR!       /home/runner/work/telestion-client/telestion-client/packages/node_modules doesn't exist or is not a directory
ERR!       /home/runner/work/telestion-client/node_modules doesn't exist or is not a directory
ERR!       /home/runner/work/node_modules doesn't exist or is not a directory
ERR!       /home/runner/node_modules doesn't exist or is not a directory
ERR!       /home/node_modules doesn't exist or is not a directory
ERR!       /node_modules doesn't exist or is not a directory
ERR!       looking for modules in /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/node_modules
ERR!         using description file: /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/package.json (relative path: ./node_modules)
ERR!           Field 'browser' doesn't contain a valid alias configuration
ERR!       looking for modules in /home/runner/work/telestion-client/telestion-client/node_modules
ERR!         using description file: /home/runner/work/telestion-client/telestion-client/package.json (relative path: ./node_modules)
ERR!           Field 'browser' doesn't contain a valid alias configuration
ERR!           using description file: /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/package.json (relative path: ./node_modules/@storybook/addon-docs/blocks)
ERR!             no extension
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!           using description file: /home/runner/work/telestion-client/telestion-client/package.json (relative path: ./node_modules/@storybook/addon-docs/blocks)
ERR!             no extension
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/node_modules/@storybook/addon-docs/blocks doesn't exist
ERR!             .mjs
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/node_modules/@storybook/addon-docs/blocks doesn't exist
ERR!             .mjs
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/node_modules/@storybook/addon-docs/blocks.mjs doesn't exist
ERR!             .js
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/node_modules/@storybook/addon-docs/blocks.mjs doesn't exist
ERR!             .js
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/node_modules/@storybook/addon-docs/blocks.js doesn't exist
ERR!             .jsx
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/node_modules/@storybook/addon-docs/blocks.js doesn't exist
ERR!             .jsx
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/node_modules/@storybook/addon-docs/blocks.jsx doesn't exist
ERR!             .ts
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/node_modules/@storybook/addon-docs/blocks.jsx doesn't exist
ERR!             .ts
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/node_modules/@storybook/addon-docs/blocks.ts doesn't exist
ERR!             .tsx
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/node_modules/@storybook/addon-docs/blocks.ts doesn't exist
ERR!             .tsx
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/node_modules/@storybook/addon-docs/blocks.tsx doesn't exist
ERR!             .json
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/node_modules/@storybook/addon-docs/blocks.tsx doesn't exist
ERR!             .json
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/node_modules/@storybook/addon-docs/blocks.json doesn't exist
ERR!             .cjs
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/node_modules/@storybook/addon-docs/blocks.json doesn't exist
ERR!             .cjs
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/node_modules/@storybook/addon-docs/blocks.cjs doesn't exist
ERR!               /home/runner/work/telestion-client/telestion-client/node_modules/@storybook/addon-docs/blocks.cjs doesn't exist
ERR!             as directory
ERR!               /home/runner/work/telestion-client/telestion-client/packages/telestion-client-common/node_modules/@storybook/addon-docs/blocks doesn't exist
ERR!             as directory
ERR!               /home/runner/work/telestion-client/telestion-client/node_modules/@storybook/addon-docs/blocks doesn't exist
Error: non-zero exit code