Angular 12 does not build with Preact 10.13 #7225

vgoreiko · 2023-02-24T15:58:04Z

Reduced Test Case

Angular 11 project with fullcalendar@5.11.4

Do you understand that if a reduced test case is not provided, we will intentionally delay triaging of your ticket?

I understand

Which connector are you using (React/Angular/etc)?

Angular

Bug Description

We use FullCalendar in Angular project. And today recently build start to fail constantly.
As I see, there is a dependency in @fullcalendar/core from "preact": "^10.0.5" and it is not strict.
Several hours ago this preact package was updated to the version 10.13.0.

  "devDependencies": {
    "@angular-devkit/build-angular": "0.1102.12",
    "@angular/cli": "11.2.12",
    "@angular/compiler-cli": "11.2.13",
    "@angular/language-service": "11.2.13",
    "@tailwindcss/line-clamp": "^0.4.2",
    "@types/file-saver": "2.0.1",
    "@types/lodash": "4.14.168",
    "@types/moment-timezone": "0.5.13",
    "@types/node": "16.11.26",
    "@types/qs": "6.9.6",
    "autoprefixer": "^10.4.13",
    "postcss": "^8.4.18",
    "tailwindcss": "^2.2.19",
    "ts-node": "9.1.1",
    "typescript": "4.1.6"
  }

part of dependencies:

    "@angular/animations": "11.2.13",
    "@angular/cdk": "11.2.12",
    "@angular/common": "11.2.13",
    "@angular/compiler": "11.2.13",
    "@angular/core": "11.2.13",
    "@angular/forms": "11.2.13",
    "@angular/material": "11.2.12",
    "@angular/platform-browser": "11.2.13",
    "@angular/platform-browser-dynamic": "11.2.13",
    "@angular/router": "11.2.13",
    "@fullcalendar/angular": "5.11.4",
    "@fullcalendar/core": "5.11.4",
    "@fullcalendar/interaction": "5.11.4",
    "@fullcalendar/resource-common": "5.11.4",
    "@fullcalendar/resource-timegrid": "5.11.4",
    "@fullcalendar/scrollgrid": "5.11.4",

part of package.lock.json

		"node_modules/@fullcalendar/angular/node_modules/@fullcalendar/core": {
			"version": "5.11.4",
			"resolved": "https://registry.npmjs.org/@fullcalendar/core/-/core-5.11.4.tgz",
			"integrity": "sha512-p1/GRIageomlyJpsMVi+Ig5TNo9t2sEYsLHe6zvtCLtpXK/l03veZukYyM/jou8VzT0VJp1f7yN8irc5VBgqxw==",
			"dependencies": {
				"@fullcalendar/common": "~5.11.4",
				"preact": "^10.0.5",
				"tslib": "^2.1.0"
			}
		},

Error:

✔ Browser application bundle generation complete.
Error: node_modules/preact/src/jsx.d.ts:2138:24 - error TS2304: Cannot find name 'SVGMPathElement'.
2138  	mpath: SVGAttributes<SVGMPathElement>;
      	                     ~~~~~~~~~~~~~~~
Error: node_modules/preact/src/jsx.d.ts:2145:22 - error TS2304: Cannot find name 'SVGSetElement'.
2145  	set: SVGAttributes<SVGSetElement>;

As a quick fix: add preact packages 10.0.5 as dev dependency. But this is temporary solution!

The text was updated successfully, but these errors were encountered:

rschristian · 2023-02-28T05:26:04Z

You're using a very old version of TypeScript that does not ship with SVGMPathElement or SVGSetElement types. It looks like they were added in v4.4: microsoft/TypeScript#44842

Preact v10.13.0 depends on these to provide better typing support for SVG elements. Either downgrade your Preact version, upgrade your TS version to something modern, or add "skipLibCheck": true in your tsconfig.json

vgoreiko · 2023-02-28T08:30:42Z

You're using a very old version of TypeScript that does not ship with SVGMPathElement or SVGSetElement types. It looks like they were added in v4.4: microsoft/TypeScript#44842

Preact v10.13.0 depends on these to provide better typing support for SVG elements. Either downgrade your Preact version, upgrade your TS version to something modern, or add "skipLibCheck": true in your tsconfig.json

I do not use preact at all. This is a dependency of Fullcalendar/core and I assume that it is needed for React, but I use Angular.
Why it defined as a dependency in core package and influence on Angular library version?

Please check my request once more: packages were not changed for a half a year, everything worked fine until external update of preact package which is a dependency of Fullcalendar/core without strict version.

From my prospective, packages should be defined such way, that any update of external depth wont break anything. In this exact case "@fullcalendar/angular": "5.11.4" should depend not on preact this way "preact": "^10.0.5",`, but like this "preact": "10.0.5 - 10.12.1"

rschristian · 2023-02-28T08:58:40Z

I do not use preact at all. This is a dependency of Fullcalendar/core and I assume that it is needed for React, but I use Angular.
Why it defined as a dependency in core package and influence on Angular library version?

Because @fullcalendar/core is built off of Preact. You do use Preact, just not directly.

Please check my request once more: packages were not changed for a half a year, everything worked fine until external update of preact package which is a dependency of Fullcalendar/core without strict version.

You can pin library versions yourself, if need be.

but like this "preact": "10.0.5 - 10.12.1"

I all but guarantee there are TS breaking changes in that range too. Trying to restrict versions based on which in-built TS features it relies on is just not the way the TS ecosystem works, for better or for worse.

For what it's worth, I'm not a maintainer here, but I am one of Preact's maintainers and someone made a similar bug in the Preact repo today, which is why I'm here. I personally can't debate the merits of version pinning for this library, however, types more or less exist outside of semver -- as any alteration at all is a breaking change, they're generally not included in semver considerations.

IamZiaullah · 2023-02-28T11:38:13Z

if you lock your preact version manually in package.json like "preact": "10.0.5 - 10.12.1", it solves the issue for the project which are using TypeScript v < 4.4 and @fullcalendar v5. but if you don't want to preact manually to your package.json try adding the flag "skipLibCheck": true to compilerOption object in tsconfig.json

EliezerB123 · 2023-02-28T11:47:45Z

@rschristian

I'd like to add that Angular 12's maximum typescript version is v4.3.5. So any libraries that were using preact and supported Angular < 13 no longer work.

...Which was.. a very unpleasant surprise. (We're having the same issue in our Angular 12 project.)

rschristian · 2023-02-28T12:02:17Z

I mentioned 3 possible solutions above, but you can also patch the types or disable Angular's TS version check, apparently.

Again, not a maintainer, just trying to give some possible solutions as someone raised this issue on our tracker earlier.

arshaw · 2023-03-16T19:08:49Z

Fix is queued for release. I'm scoping preact's semver to "~10.12.1". This will be the case for FullCalendar v5 and v6

arshaw · 2023-03-21T20:17:58Z

Implemented in v6.1.5
https://cdn.jsdelivr.net/npm/@fullcalendar/core@6.1.5/package.json

Please post here if there are continued issues with this.

vgoreiko · 2023-03-22T10:44:50Z

It still does not work for fullcalendar@5.11.4:

Verify here version of preact:
https://www.npmjs.com/package/@fullcalendar/core/v/5.11.4?activeTab=code

 "dependencies": {
    "@fullcalendar/common": "~5.11.4",
    "preact": "^10.0.5",
    "tslib": "^2.1.0"
  },

Maybe it`s better to up the version of the package?

IamZiaullah · 2023-03-22T11:21:07Z

It still does not work for fullcalendar@5.11.4:

Verify here version of preact: https://www.npmjs.com/package/@fullcalendar/core/v/5.11.4?activeTab=code
 "dependencies": {
    "@fullcalendar/common": "~5.11.4",
    "preact": "^10.0.5",
    "tslib": "^2.1.0"
  },
Maybe it`s better to up the version of the package?

They fixed the issue in version 6.1.5. v5.11.4 is legacy now, what is suggest is update your @fullcalender core and all the relevant packages

vgoreiko · 2023-03-22T11:27:55Z

It still does not work for fullcalendar@5.11.4:
Verify here version of preact: https://www.npmjs.com/package/@fullcalendar/core/v/5.11.4?activeTab=code
 "dependencies": {
    "@fullcalendar/common": "~5.11.4",
    "preact": "^10.0.5",
    "tslib": "^2.1.0"
  },
Maybe it`s better to up the version of the package?
They fixed the issue in version 6.1.5. v5.11.4 is legacy now, what is suggest is update your @fullcalender core and all the relevant packages

Great fix:)
I have a several projects with Angular 11 and fullcalendar 5.11.4 and because of this library, should I update Angular?
Why not to do same fix for v5 - just publish 5.11.5?
Seems like I`m not the one, who use v5

IamZiaullah · 2023-03-22T11:35:03Z

It still does not work for fullcalendar@5.11.4:
Verify here version of preact: https://www.npmjs.com/package/@fullcalendar/core/v/5.11.4?activeTab=code
 "dependencies": {
    "@fullcalendar/common": "~5.11.4",
    "preact": "^10.0.5",
    "tslib": "^2.1.0"
  },
Maybe it`s better to up the version of the package?
They fixed the issue in version 6.1.5. v5.11.4 is legacy now, what is suggest is update your @fullcalender core and all the relevant packages
Great fix:) I have a several projects with Angular 11 and fullcalendar 5.11.4 and because of this library, should I update Angular? Why not to do same fix for v5 - just publish 5.11.5? Seems like I`m not the one, who use v5

For version 5 you can manually lock preact package to the old version i did something like "preact": "10.0.5 - 10.12.1", in package.json file

vgoreiko · 2023-03-23T16:56:14Z

I can, and this is what I`ve done before, but expected, that the owner of the library will provide fix for the 5th version also.

arshaw · 2023-04-03T22:50:35Z

Apologies @vgoreiko , I'll backport this bugfix to v5 as well. Please stay tuned...

arshaw · 2023-05-08T22:54:12Z

This has been released in v5.11.5. Sorry for the delay @vgoreiko.

Links:

rschristian mentioned this issue Feb 28, 2023

Cannot find name 'SVGMPathElement' preactjs/preact#3918

Closed

1 task

rschristian mentioned this issue Feb 28, 2023

My build fail since yesterday with an error message from preact preactjs/preact#3920

Closed

acerix mentioned this issue Mar 4, 2023

My build fail since yesterday with an error message from preact #7228

Closed

1 task

acerix changed the title ~~Cannot find name 'SVGSetElement' issue in Angular project~~ Angular 12 does not build with Preact 10.13 Mar 4, 2023

acerix added Confirmed Distribution labels Mar 4, 2023

acerix assigned arshaw Mar 4, 2023

acerix added the Angular Only label Mar 4, 2023

arshaw added this to the upcoming-release milestone Mar 6, 2023

arshaw closed this as completed Mar 21, 2023

arshaw reopened this Apr 3, 2023

arshaw modified the milestones: v6.1.5, next-release Apr 3, 2023

arshaw modified the milestones: next-release, v6.1.7 May 8, 2023

arshaw closed this as completed May 8, 2023

arshaw removed this from the v6.1.7 milestone May 8, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Angular 12 does not build with Preact 10.13 #7225

Angular 12 does not build with Preact 10.13 #7225

vgoreiko commented Feb 24, 2023

rschristian commented Feb 28, 2023

vgoreiko commented Feb 28, 2023

rschristian commented Feb 28, 2023

IamZiaullah commented Feb 28, 2023 •

edited

EliezerB123 commented Feb 28, 2023 •

edited

rschristian commented Feb 28, 2023

arshaw commented Mar 16, 2023

arshaw commented Mar 21, 2023

vgoreiko commented Mar 22, 2023

IamZiaullah commented Mar 22, 2023

vgoreiko commented Mar 22, 2023

IamZiaullah commented Mar 22, 2023

vgoreiko commented Mar 23, 2023

arshaw commented Apr 3, 2023

arshaw commented May 8, 2023

Angular 12 does not build with Preact 10.13 #7225

Angular 12 does not build with Preact 10.13 #7225

Comments

vgoreiko commented Feb 24, 2023

Reduced Test Case

Do you understand that if a reduced test case is not provided, we will intentionally delay triaging of your ticket?

Which connector are you using (React/Angular/etc)?

Bug Description

rschristian commented Feb 28, 2023

vgoreiko commented Feb 28, 2023

rschristian commented Feb 28, 2023

IamZiaullah commented Feb 28, 2023 • edited

EliezerB123 commented Feb 28, 2023 • edited

rschristian commented Feb 28, 2023

arshaw commented Mar 16, 2023

arshaw commented Mar 21, 2023

vgoreiko commented Mar 22, 2023

IamZiaullah commented Mar 22, 2023

vgoreiko commented Mar 22, 2023

IamZiaullah commented Mar 22, 2023

vgoreiko commented Mar 23, 2023

arshaw commented Apr 3, 2023

arshaw commented May 8, 2023

IamZiaullah commented Feb 28, 2023 •

edited

EliezerB123 commented Feb 28, 2023 •

edited