[SOLVED] PCUI build

Help & Support
1

Hi everyone, I tried to build the last repo of PCUI, but in my dist folder cant find something like:

  • pcui.js
  • pcui-binding.js

is there a a command, beside npm run build, I should use ?
Thank you in advance

2

@will @Elliott ?

As a side question, any reason not to use the packages on NPM? Do you have a custom build/fork of PCUI?

3

Hi @Mirko_Arcese. PCUI v3.0.0 was released yesterday which drops support for an ES5 (UMD) build. We now only ship an ESM build.

4

Hi @yaustar , i have absolutely no need for custom build, i just did what i thought was necessary :slight_smile:

5

Hi, congrats for new release ! I dont know wxaclty what ESM is, i just started from a lexzic sample,is there any sample project or buikt package to import in pc ?

Thank you very much

6

Ah, you are trying to use it with a PlayCanvas Editor project?

That’s a bit tricky with the latest build as you now would need to browserify the build following the steps: Getting Started with Browserify - SitePoint

Edit: These are simpler steps: https://www.webtips.dev/use-npm-modules-in-your-browser

7

Yes I need to use it within PC, i had a couple of projects using the “old” version and was tryinf to update.
For now i guess my skills are not enough to make out with browserify :slight_smile:

8

If I get some time, I will try to do a fork of LeXXik’s project with an updated version

9

Thank you, much appreciated.

10

I think I got it working: https://playcanvas.com/project/1021958/overview/pcui-30-debug-draw

Self note: I used this tutorial to webpack and bundle the output How to publish a npm package in four steps | by Vinicius Marchesin Araujo | Medium but changed the libraryType from ‘commonjs2’ to ‘window’

The index.js file that I built is:

import * as pcui from '@playcanvas/pcui';
import '@playcanvas/pcui/styles';

window.pcui = pcui;
1 Like
11

Thank you very much, I tried to use RadioButton & BooleanInput, and it seems like the arg “text” is kinda ignored, does it have something to do with library building ?

Anyhow, really thanks

12

Yeah, I just tried setting the text property of RadioButton and nothing changed. Looking at the source. the text option is ignored/unused. @Elliott, is the intention here that RadioButton should be used with a separate Label element? And if so, can I delete this text property from RadioButton?

As for BooleanInput, it doesn’t support a text field being passed to the constructor. See API reference:

Presumably you’d use a Label there too.

13

Thank you for feedback, btw the text on radio and boolen is very useful, otherwise layout become complex just to show the name of a property.
If it has to be used a label/button combination, how to display them on same line ? should they be grouped into an horizontal layout ?

14

I believe this is why there is LabelGroup:

Docs say:

Represents a group of a Label and a Element. Useful for rows of labeled fields.

15

I’ve removed the text argument for RadioButton here:

16

Thank you very much, I didn’t see it before, and it works like a charm !

1 Like