YARN PnP - Storybook/angular - Error EROFS: read-only filesystem, open '/node_modules/.ngcc_lock_file'

[ld210]

Describe the bug When using Yarn PnP, start-storybook or build-storybook won't work. Here's the error:

return Object.assign(new Error(`${code}: ${message}`), {code});
                       ^

Error: EROFS: read-only filesystem, open '/node_modules/.ngcc_lock_file'
    at makeError$1 (/Users/tfassolis/Documents/Git/pnptest/.pnp.cjs:28401:24)
    at EROFS (/Users/tfassolis/Documents/Git/pnptest/.pnp.cjs:28428:10)
    at ZipFS.prepareWriteFile (/Users/tfassolis/Documents/Git/pnptest/.pnp.cjs:30213:13)
    at ZipFS.writeFileSync (/Users/tfassolis/Documents/Git/pnptest/.pnp.cjs:30197:53)
    at /Users/tfassolis/Documents/Git/pnptest/.pnp.cjs:31244:20
    at /Users/tfassolis/Documents/Git/pnptest/.pnp.cjs:31442:60
    at ZipOpenFS.getZipSync (/Users/tfassolis/Documents/Git/pnptest/.pnp.cjs:31571:14)
    at ZipOpenFS.makeCallSync (/Users/tfassolis/Documents/Git/pnptest/.pnp.cjs:31442:17)
    at ZipOpenFS.writeFileSync (/Users/tfassolis/Documents/Git/pnptest/.pnp.cjs:31241:17)
    at VirtualFS.writeFileSync (/Users/tfassolis/Documents/Git/pnptest/.pnp.cjs:30598:24) {
  code: 'EROFS'
}

To Reproduce Here is a reproduction repo : https://github.com/ld210/yarnpnp-storybook-angular-repro Do a yarn install, and then try yarn run storybook or yarn ng run pnptest:storybook

System Environment Info:

System: OS: macOS 12.4 CPU: (8) arm64 Apple M1 Binaries: Node: 16.13.1 - /private/var/folders/pp/hlwx4ttn1gn30q105lb_b800tt2glm/T/xfs-6c9ce97e/node Yarn: 3.2.1 - /private/var/folders/pp/hlwx4ttn1gn30q105lb_b800tt2glm/T/xfs-6c9ce97e/yarn npm: 8.1.2 - /usr/local/bin/npm Browsers: Chrome: 103.0.5060.53 Firefox: 101.0 Safari: 15.5

Couple things worth noting

• there is a node_modules folder in the reproduction repo, that contains a fake cache folder(.pnp). This node_modules folder is only here to keep the Angular CLI happy, until this Pull-Request is published in a future Angular release : https://github.com/angular/angular-cli/pull/23487
• The fake cache folder (node_modules/.pnp) is there only to prevent yarn install command to delete node_modules folder
• Everything Angular relate (ng serve, ng build, ng test, ng lint) works fine.

[ld210]

The Angular team has just release the v14.0.5, that include this fix : https://github.com/angular/angular-cli/pull/23487 Storybook is still not working in PnP mode, getting the same error.

[ld210]

Still getting the same error with Storybook v6.5.10 or 7.0.0-alpha.18

[tschaffter]

@ld210 Unplugging @angular/compiler-cli solved the error EROFS: read-only filesystem, open '/node_modules/.ngcc_lock_file'. See https://github.com/Sage-Bionetworks/challenge-registry/issues/755#issuecomment-1267094617 for more detailed information.