[Bug]: `@storybook/angular@6.5.16` is incompatible with angular 15?

ruslanss commented 1 year ago

Describe the bug

Hello, trying to use the currently latest release v6.5.16 with Angular 15.2.0 and seeing this error:

npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: @angular-devkit/build-angular@14.2.6
npm ERR! Found: @angular/compiler-cli@15.2.0
npm ERR! node_modules/@angular/compiler-cli
npm ERR!   dev @angular/compiler-cli@"15.2.0" from the root project
npm ERR!   peer @angular/compiler-cli@">=6.0.0" from @storybook/angular@6.5.16
npm ERR!   node_modules/@storybook/angular
npm ERR!     dev @storybook/angular@"^6.5.12" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/compiler-cli@"^14.0.0" from @angular-devkit/build-angular@14.2.6
npm ERR! node_modules/@angular-devkit/build-angular
npm ERR!   peer @angular-devkit/build-angular@">=0.8.9 || >= 12.0.0" from @storybook/angular@6.5.16
npm ERR!   node_modules/@storybook/angular
npm ERR!     dev @storybook/angular@"^6.5.12" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: @angular/compiler-cli@14.2.12
npm ERR! node_modules/@angular/compiler-cli
npm ERR!   peer @angular/compiler-cli@"^14.0.0" from @angular-devkit/build-angular@14.2.6
npm ERR!   node_modules/@angular-devkit/build-angular
npm ERR!     peer @angular-devkit/build-angular@">=0.8.9 || >= 12.0.0" from @storybook/angular@6.5.16
npm ERR!     node_modules/@storybook/angular
npm ERR!       dev @storybook/angular@"^6.5.12" from the root project

am I right in assuming @storybook/angular@6.5.16 is incompatible with angular 15? are there any workarounds?

To Reproduce

No response

System

No response

Additional context

No response

valentinpalkovic commented 1 year ago

@ruslanss I can‘t verify, whether it is incompatible, but we definitely don‘t maintain Angular 15 support in Storybook 6.5. Instead, try to upgrade to our latest prerelease 7.0 version, which has full Angular 15 support!

https://storybook.js.org/blog/7-0-beta/

npx storybook@next upgrade --prerelease

ruslanss commented 1 year ago

thanks, I've tried the upgrade and it's still appear to be looking for some of the Angular 14.x dependencies:

npm ERR! While resolving: @angular-devkit/build-angular@14.2.6
npm ERR! Found: @angular/compiler-cli@15.2.0
npm ERR! node_modules/@angular/compiler-cli
npm ERR!   dev @angular/compiler-cli@"15.2.0" from the root project
npm ERR!   peer @angular/compiler-cli@">=14.1.0 < 16.0.0" from @storybook/angular@7.0.0-beta.59
npm ERR!   node_modules/@storybook/angular
npm ERR!     dev @storybook/angular@"^7.0.0-beta.59" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/compiler-cli@"^14.0.0" from @angular-devkit/build-angular@14.2.6
npm ERR! node_modules/@angular-devkit/build-angular
npm ERR!   peer @angular-devkit/build-angular@">=14.1.0 < 16.0.0" from @storybook/angular@7.0.0-beta.59
npm ERR!   node_modules/@storybook/angular
npm ERR!     dev @storybook/angular@"^7.0.0-beta.59" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: @angular/compiler-cli@14.2.12
npm ERR! node_modules/@angular/compiler-cli
npm ERR!   peer @angular/compiler-cli@"^14.0.0" from @angular-devkit/build-angular@14.2.6
npm ERR!   node_modules/@angular-devkit/build-angular
npm ERR!     peer @angular-devkit/build-angular@">=14.1.0 < 16.0.0" from @storybook/angular@7.0.0-beta.59
npm ERR!     node_modules/@storybook/angular
npm ERR!       dev @storybook/angular@"^7.0.0-beta.59" from the root project

valentinpalkovic commented 1 year ago

Please run npx sb@next info and paste the content here.

ruslanss commented 1 year ago

out put from npm exec sb@next:

Environment Info:

  System:
    OS: Windows 10 10.0.22621
    CPU: (16) x64 Intel(R) Core(TM) i9-10980HK CPU @ 2.40GHz
  Binaries:
    Node: 16.16.0 - C:\Program Files\nodejs\node.EXE
    npm: 8.11.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22621.1265.0), Chromium (110.0.1587.57)
  npmPackages:
    @storybook/addon-actions: ^7.0.0-beta.59 => 6.5.12
    @storybook/addon-essentials: ^7.0.0-beta.59 => 6.5.12
    @storybook/addon-interactions: ^7.0.0-beta.59 => 6.5.12
    @storybook/addon-links: ^7.0.0-beta.59 => 6.5.12
    @storybook/angular: ^7.0.0-beta.59 => 6.5.16
    @storybook/builder-webpack5: ^7.0.0-beta.59 => 6.5.13
    @storybook/manager-webpack5: ^6.5.13 => 6.5.13
    @storybook/testing-library: 0.0.14-next.1 => 0.0.13

valentinpalkovic commented 1 year ago

So you can safely uninstall @storybook/builder-webpack5 and @storybook/manager-webpack5. Also, as the info tells you, you have still 6.5 packages installed. Did you forget to run npm install?

jagomf commented 1 year ago

@ruslanss Storybook 6.x is not compatible with Angular >= 14. I already found myself trying to use those @storybook/builder-webpack5 and @storybook/manager-webpack5 that @valentinpalkovic mentions with no success at all.

The reason is @storybook/angular@6.5.* indirectly depends on @storybook/builder-webpack4 as mentioned in #20062 and there is nothing you can do regarding that apart from migrating to Storybook 7, which gets rid of a webpack dependency.

It is really disappointing that Storybook team is not interested on making those @storybook/builder-webpack5 and @storybook/manager-webpack5 actually do what they are supposed to do, at least for Angular.

ruslanss commented 1 year ago

valentinpalkovic com

npm install command was failing due to error i reported above. with your suggestion, the upgrade now works and we might be doing a release to production with storybook 7.0.0-beta.61

thanks 🙌

storybookjs / storybook