Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Invalid Storybook Build

See original GitHub issue

Chromatic CLI v6.5.4
https://www.chromatic.com/docs/cli

  ✔ Authenticated with Chromatic
    → Using project token '************'
  ✔ Retrieved git information
    → Commit 'commit' on branch 'branch'; found 1 parent build
  ✔ Collected Storybook metadata
    → Storybook ^6.4.22 for React; supported addons found: Actions, Backgrounds, Docs, Essentials, Lin
ks
  ↓ Build Storybook [skipped]
    → Using prebuilt Storybook at storybook-static/
  ✖ Publish your built Storybook
    → Invalid Storybook build at storybook-static/
    Verify your Storybook
    Test your stories

✖ Failed to publish your built Storybook
Invalid Storybook build at storybook-static/
→ View the full stacktrace below

If you need help, please chat with us at https://www.chromatic.com/docs/cli for the fastest response.
You can also email the team at support@chromatic.com if chat is not an option.

Please provide us with the above CLI output and the following info:
{
  "timestamp": "2022-05-14T12:37:52.832Z",
  "sessionId": "d3d781d1-bcac-406a-bdf5-54337713580c",
  "gitVersion": "2.25.1",
  "nodePlatform": "linux",
  "nodeVersion": "16.15.0",
  "packageName": "chromatic",
  "packageVersion": "6.5.4",
  "storybook": {
    "addons": [
      {
        "name": "actions",
        "packageName": "@storybook/addon-actions",
        "packageVersion": "^6.4.22"
      },
      {
        "name": "backgrounds",
        "packageName": "@storybook/addon-backgrounds",
        "packageVersion": "^6.4.22"
      },
      {
        "name": "docs",
        "packageName": "@storybook/addon-docs",
        "packageVersion": "^6.4.22"
      },
      {
        "name": "essentials",
        "packageName": "@storybook/addon-essentials",
        "packageVersion": "^6.4.22"
      },
      {
        "name": "links",
        "packageName": "@storybook/addon-links",
        "packageVersion": "^6.4.22"
      }
    ],
    "viewLayer": "react",
    "version": "^6.4.22"
  },
  "flags": {
    "exitZeroOnChanges": "",
    "storybookBuildDir": [
      "storybook-static/"
    ],
    "projectToken": [
      "REDACTED"
    ],
    "outputDir": [],
    "externals": [],
    "untraced": [],
    "interactive": true,
    "appCode": []
  },
  "exitCode": 0,
  "exitCodeKey": "OK",
  "errorType": "Error",
  "errorMessage": "✖ Failed to publish your built Storybook"
}

I get the same error (Invalid Storybook build) when letting chromatic build storybook with npx chromatic --project-token ... or by passing it the built folder with npx chromatic --exit-zero-on-changes -d storybook-static/ --project-token=.... Storybook works fine on its own.

These are my build folder contents:

0.2f727af8bd8140d7353f.manager.bundle.js
4.b424631a75c096e3f73e.manager.bundle.js
4.b424631a75c096e3f73e.manager.bundle.js.LICENSE.txt
5.c259fa960f9f958f32cd.manager.bundle.js
6.c7e2f997229f91d916e8.manager.bundle.js
6.c7e2f997229f91d916e8.manager.bundle.js.LICENSE.txt
7.a16f201360fc3133ba99.manager.bundle.js
8.0fcf98f7e6d0fdd6c7fc.manager.bundle.js
favicon.ico
index.html
main.4837f83a2e7238a9b57b.manager.bundle.js
runtime~main.a1feafd47e231ba5a583.manager.bundle.js
vendors~main.57126e1f461bb881b21b.manager.bundle.js
vendors~main.57126e1f461bb881b21b.manager.bundle.js.LICENSE.txt

Issue Analytics

State:
Created a year ago
Comments:11 (1 by maintainers)

Top GitHub Comments

2reactions

pietrovismaracommented, Jun 28, 2022

Mmmh the contents of the folder look fine so it looks like the issue you’re having is different from the one I had. Also, I use React so it might be something related to Vue in your case.

The only thing I can suggest at this point is to try to remove each customization of the config one by one until you see some difference with the result.

I’m not gonna be of great help I’m afraid. It would be cool if chromatic gave some more info as to why the build is invalid.

1reaction

Rusinascommented, Jun 28, 2022

Found the solution. Cause of the problem was that I didn’t have createVuePlugin() enabled for chromatic build. It’s weird thing, because in some cases enabling it causes more issues (npm run dev wouldn’t work for example), so I thought it shouldn’t be required for Chromatic. I was wrong.

Actually, what helped me is --debug flag 😂