## Summary - Use a writable `.webstudio/preview/.npm-cache` for npm preview installs when `npm_config_cache` is not explicitly configured. - Preserve explicit npm cache settings and pnpm behavior. - Document a safe recovery path that requires no cache deletion. This removes preview startup failures caused by an unwritable default npm cache. Initial dependency installation and its network/download cost still remain when preview dependencies are not already installed. ## Technical choices - Keep the cache beside the isolated generated preview because that directory is already writable and reused across regenerations. - Let an explicit `npm_config_cache` continue to take precedence. - Do not retry arbitrary install failures or classify package-manager prose. ## Todo - [x] Reproduce npm dependency installation against an unwritable cache before changing code. - [x] Reproduce #6274 at the same dependency-install stage used by session-backed screenshots. - [x] Demonstrate the regression assertion failing before the fix and passing afterward. - [x] Use the preview-local cache only for npm without an explicit cache. - [x] Preserve explicit npm cache configuration and pnpm behavior. - [x] Verify the real dependency installer against an unwritable project npm cache. - [x] Verify session-backed screenshot flow proceeds from successful preview preparation to browser capture. - [x] Review documentation impact and update the CLI manual plus generated MCP documentation. - [x] Review fixture impact; no project fixture inputs or outputs are affected. - [x] Review the final diff for correctness, duplication, and unnecessary complexity. ## Verification - Actual npm install reproduced #6269 and #6274 with `EPERM` against an unwritable cache. - Real preview dependency installation passed after the fix while project npm configuration still pointed at that cache. - Fail-before/pass-after regression demonstrated. - `pnpm --filter webstudio test` — 65 files, 1,044 tests passed. - `pnpm --filter webstudio typecheck` - `pnpm lint` - `pnpm check:generated-docs` - Formatting and diff checks passed. - GitHub CI after rebasing onto current `main` — 30 checks passed, 7 skipped, no failures. - Agent evaluations were not run because they require separate explicit approval. Closes #6269 Closes #6274
description
| description |
|---|
| New to Webstudio? |
👋 Welcome
Our getting started guide will help you navigate through building your first Webstudio website. It covers the essentials of creating web designs and integrating third-party tools. You'll learn how to utilize Webstudio's unique features like Design tokens and Components, and how to contribute to the project.
{% content-ref url="basics/building-your-first-site.md" %} building-your-first-site.md {% endcontent-ref %}
{% content-ref url="university/foundations/" %} foundations {% endcontent-ref %}
{% content-ref url="university/core-components/" %} core-components {% endcontent-ref %}
{% content-ref url="university/cli.md" %} cli.md {% endcontent-ref %}
{% content-ref url="university/inception.md" %} inception.md {% endcontent-ref %}
{% content-ref url="university/radix/" %} radix {% endcontent-ref %}
{% content-ref url="university/marketplace.md" %} marketplace.md {% endcontent-ref %}
{% content-ref url="university/self-hosting/" %} self-hosting {% endcontent-ref %}
{% content-ref url="university/how-tos/" %} how-tos {% endcontent-ref %}
{% content-ref url="university/integrations/" %} integrations {% endcontent-ref %}
{% content-ref url="university/craft.md" %} craft.md {% endcontent-ref %}
{% content-ref url="basics/FAQ.md" %} FAQ.md {% endcontent-ref %}
Looking to contribute to Webstudio?
{% content-ref url="contributing/contributions.md" %} contributions.md {% endcontent-ref %}
{% content-ref url="contributing/marketplace.md" %} marketplace.md {% endcontent-ref %}