PCUI Framework Build Source Failing?

Help & Support
#1

Normally I would create an issue in both the PCUI and PCUI-Graph reposiories on Github.
But I wanted to double-check if this is potentially a build fail on the PlayCanvas developers side.

CDN and build generator sites such as Skypack https://cdn.skypack.dev/ fail to compile/build the PCUI framework and in doing also fails PCUI-Graph which is also built off of said PCUI framework.

I do not believe this is the site’s fault but I would like a second opinion before I create some repo issues.

Finally, I apologize in advance if I accidentally insult anyone’s feelings.
But unfortunately both frameworks have poor package-scores, meaning their build setups are structured to compile properly.

PCUI: npm:@playcanvas/pcui | Skypack

image

PCUI-Graph: npm:@playcanvas/pcui-graph | Skypack

image

PCUI-Observer : Higher Score: npm:@playcanvas/observer | Skypack
PCUI-Observer : Lower Score: npm:playcanvas-observer | Skypack

It is interesting because for example PCUI-Observer seems to have a good score.
But strangely there are two official build links on that site, one with a good score and the other with a lower score.

image

image

Engine-Only: npm:playcanvas | Skypack

The genuine official PlayCanvas Engine-Only CDN has a very good score.

image

#2

I’ve done completely fresh pulls from the repos and built from scratch. All built successfully on Mac

image
image1476×1754 317 KB

image
image1504×598 168 KB

image
image1678×672 183 KB

All 3 repos are used for the PlayCanvas Editor which is built on Linux on our CI build machines

#3

Would you mind taking a look at my CodePen if you have a moment?
https://codepen.io/RandomPanda/pen/ExwrPqB

I am using the code-snippets from the PCUI React section.
Please note that I have already setup basic React modules.
But the PCUI modules/PCUI React components are not found.
https://playcanvas.github.io/pcui/react/

Currently I am unsure if this is a SkyPack error, as I get errors that are relatively unclear to me but may seem clear to others such as you.

CodePen Build Error

image
image1095×193 7.6 KB

SkyPack Build Server Error

image
image867×59 3.49 KB

#4

Perhaps it is because the “exports” destinations are not stated in the package.json for PCUI?

Edit

Even places such as https://www.jsdelivr.com/ fail to build the PCUI from source.
Their PCUI link: @playcanvas/pcui CDN by jsDelivr - A CDN for npm and GitHub

#5

Unfortunately, outside of the way we support and use it, we can’t really be going round debugging how to make it work the multiple NPM delivery mechanisms/services that exist.

Please do file a ticket and maybe during some downtime we could take a quick look but I wouldn’t expect a quick resolution to it.

#6

Created issue: https://github.com/playcanvas/pcui/issues/154

#7

Sorry to bump/ping this thread again. But I am positive this is the issue with the remote building of the PCUI package. Perhaps @Elliott could confirm this hypothesis?

The PCUI package.json is missing at least one ESM statement. Unlike the PCUI-Observer package.json which contains at least one of the required statements in its package.json, that being the argument:

"type": "module"

Which it does here: https://github.com/playcanvas/playcanvas-observer/blob/main/package.json#L15
Again, the PCUI package.json is missing this small; but apparently critical argument(s).

PCUI → :x:

Github: https://github.com/playcanvas/pcui/blob/master/package.json
SkyPack: https://www.skypack.dev/view/@playcanvas/pcui

image

PCUI-Observer → :white_check_mark:

Github: https://github.com/playcanvas/playcanvas-observer/blob/main/package.json
SkyPack: https://www.skypack.dev/view/@playcanvas/observer

image