-
Notifications
You must be signed in to change notification settings - Fork 55
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
UMD module build does not have a requirejs export #97
Comments
Looking at the rollup config, I can see the UMD output of rollup if configured as a "Immediately Invoked Function Expression", which would work for the browser with globals but is not a UMD module: Is this expected? :) Changing this to "umd" and removing the
Unrelated: @blurymind please note that for GDevelop I'll need to modify the loader code to ensure all the |
I'm afraid that pixi.js itself doesn't output to UMD, however. |
@4ian Why aren't you using CommonJS for Electron instead of UMD? |
We are, but I figured out UMD would be convenient as it's for example what is used for pixi-multistyle-text (see the generated file here) and it has the advantage of working:
So I was supposing UMD would be the more convenient way of exporting a module, as it works in CommonJS and as a browser global (and as a AMD require) with a single file :) If really required, we can always embed two files for pixi-tilemap, one as a browser global (used by the game engine), and another one as a CommonJS module (for the editor). |
@4ian I would suggest you file an issue at pixijs/pixi.js and ping @bigtimebuddy. He said he was open to it - but nobody asked for this until you. The pixi.js bundle, as of now, is in IIFE format.
On Aug 25, 2020, at 1:54 PM, Florian Rival <[email protected]<mailto:[email protected]>> wrote:
We are, but I figured out UMD would be convenient as it's for example what is used for pixi-multistyle-text<https://github.com/tleunen/pixi-multistyle-text> (see the generated file here<https://github.com/4ian/GDevelop/blob/master/Extensions/BBText/pixi-multistyle-text/dist/pixi-multistyle-text.umd.js>) and it has the advantage of working:
* In Electron (we "just" require it, and get back MultiStyleText that we can then use to render it in the editor<https://github.com/4ian/GDevelop/blob/082318d7e4e1a8a92a1318dc235f8296f52631e8/Extensions/BBText/JsExtension.js#L479>).
* In the browser, in which case it's exported as a global, that we can use directly<https://github.com/4ian/GDevelop/blob/master/Extensions/BBText/bbtextruntimeobject-pixi-renderer.js#L14>. This is what we use for the game engine (we don't have any bundling for the game engine).
So I was supposing UMD would be the more convenient way of exporting a module, as it works in CommonJS and as a browser global (and as a AMD require) with a single file :)
Maybe I missed something though that would make impossible/not satisfactory to have this module as UMD?
If really required, we can always embed two files for pixi-tilemap, one as a browser global (used by the game engine), and another one as a CommonJS module (for the editor).
—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub<#97 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/AFLJDB4HUNIBPSP7ELP3CTTSCP3GBANCNFSM4QHB3YAQ>.
|
Ah I see, I was assuming Pixi.js was UMD/CommonJS as it can be properly This being said, I see that now the umd output seems to be properly a UMD module: https://github.com/pixijs/pixi-tilemap/blob/master/dist/pixi-tilemap.umd.js since your commit 9c9c1c7 to use The output is not "totally orthodox" because things are still assigned to global PIXI and PIXI.Tilemap objects, but I guess it's no problem for us (apart from polluting a bit the globals in Electron, it should still work, and should still work in the browser). |
I will give this another try in gdevelop when I get some time :) |
All done, please try again. UMD link is correct. |
Seems like there is still an extra line at the end of the UMD module (problematic because pixi_tilemap is not defined in this context, because we're outside the function embedding the library): Apart from that, seems like a working module :) |
I don’t think that line will be removed. All PixiJS plugins are supposed to insert their API into a namespace, which is PIXI.tilemap here. You can see this for all @pixi/, pixi.js, pixi.js-legacy bundles as well. The global for pixi-tilemap isn’t pixi_tilemap, rather is PIXI.tilemap!
https://github.com/SukantPal/pixi-build-tools/blob/9942761ab8873bae2ed1d1bcc809addd8194d893/packages/globals/plugins.js#L10
On Aug 29, 2020, at 12:40 PM, Florian Rival <[email protected]> wrote:
Seems like there is still an extra line at the end of the UMD module:
https://github.com/pixijs/pixi-tilemap/blob/2b7fb150cc867da88bc1631d163f71c9b3b54190/dist/pixi-tilemap.umd.js#L961
Apart from that, seems like a working module :)
—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub<#97 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/AFLJDB53LSVGA6SJXSSB7A3SDEVOJANCNFSM4QHB3YAQ>.
|
Sorry I edited my message after you answered :) I understand that plugins will register themselves into PIXI, here in |
Can confirm that the 2.1.1 npm package simply isn't exporting the library correctly. I rolled back to npm version 2.0.6 and it works. I am not using whatever pixi bundling/rollup is mentioned a couple times elsewhere. I am simply getting npm packages and doing inside a Vue project:
Versions: |
@4ian Should it then be
|
@bpkennedy If you are using import/export, you now simply import { RectTileLayer } from 'pixi-tilemap' directly. |
There seems to be two problems:
In the UMD build: The solution is I believe to remove these
Seems like this is handled by this code in the rollup configurator but as we've seen, it would be failing in the case of CommonJS/AMD. I think there are two solutions:
but I'm not entirely sure, because playing with global is risky (the generated UMD code goes a great length for global, doing: I would rather try the first solution (import * as PIXI from 'pixi.js' and then assign PIXI.tilemap) first, as it would make a UMD module with "no hacks" (just am assignement to PIXI, which is fine as it's done inside the UMD module). |
OK, I removed Guys, I just remind you that I only slightly understand whats going on :) |
@4ian The whole point of importing from I think a better solution would be to check if if (typeof pixi_tilemap !== 'undefined) {
Object.assign(this.PIXI.tilemap, pixi_tilemap);
} Note that |
Thanks! 👍
Ah I see! Forget about it then.
Yeah that seems fair and way less complicated than my I guess we should also surely remove what is done in exporter.ts? It's assigning pixi_tilemap to PIXI.tilemap, but the generated code seems not to done anything good:
The issue being that:
Seems that this will be taken care of by the updated assign suggested by @SukantPal? Then hopefully we're good in having a well encapsulated, non leaking, but-still-working-in-the-browser-and-augmenting-PIXI-global-in-this-case module 🤞🤞 |
@4ian We should be done here? |
@ivanpopelyshev @4ian @SukantPal thanks everyone for getting involved :) with your help pixi-tilemap is getting closer to be a part of gdevelop. I will soon be able to also confirm it works ok on the web version of gdevelop. My ultimate hope is that we dont need to use a patched library in GD or if its patched its minimal |
Thanks all!
throwing an undefined reference to pixi_tilemap when used in Electron (despite the guard). |
I used to be able to
and then in a typescript project. That doesn't work anymore. I tried to |
@spassvogel Can you give us a reproduction? Are there any errors being thrown? Also, be sure to check if pixi-tilemap is not getting its own copy of |
No errors. just nothing rendered.
How would I see that?
Yes okay I can set up a test project |
@spassvogel You can see if pixi-tilemap gets its own copy by: opening node_modules/pixi-tilemap/node_modules and see if there is a @pixi package there. |
Well I tried to create an isolated case but typescript is complaining about missing typedefs
However these packages dont exist.. |
Currently the UMD module that is built is not really a complete UMD module.
it will work without issue in the browser, but I see no "require" at all that would make it compatible with
"CommonJS" and so it's possibly not loaded properly in Electron.
https://www.davidbcalhoun.com/2014/what-is-amd-commonjs-and-umd/
This is needed for pixi-tilemap to work in gdevelop
4ian/GDevelop#1901
The text was updated successfully, but these errors were encountered: