Skip to content
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.

Sign up for GitHub

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

Jump to bottom

The jsDeliver's [email protected]/+esm link doesn't work #6840

Open
8Observer8 opened this issue Jun 17, 2024 · 3 comments
Open

The jsDeliver's [email protected]/+esm link doesn't work #6840

8Observer8 opened this issue Jun 17, 2024 · 3 comments

Comments

@8Observer8
Copy link

8Observer8 commented Jun 17, 2024 •
edited
Loading

I don't know is it an issue of jsDeliver or Phaser. I have created both. The jsDeliver's issue: jsdelivr/jsdelivr#18585

This link doesn't work: https://cdn.jsdelivr.net/npm/[email protected]/+esm Try to run the example below.

Playground: https://plnkr.co/edit/MCZZM4MzkMSkFf4V?preview

index.html

<!DOCTYPE html>

<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>The jsDeliver's `[email protected]/+esm` link doesn't work</title>
</head>

<body>
    <p><a href="https://github.com/phaserjs/phaser/issues/6840" target="_black">Issue for Phaser</a></p>
    <p><a href="https://github.com/jsdelivr/jsdelivr/issues/18585" target="_black">Issue for jsDelivr</a></p>

    <script type="importmap">
        {
            "imports": {
                "phaser3": "https://cdn.jsdelivr.net/npm/[email protected]/+esm"
                // "phaser3": "https://8observer8.github.io/libs/[email protected]/phaser.esm.min.js"
            }
        }
    </script>

    <script type="module" src="./js/index.js"></script>
</body>

</html>

index.js

import { WEBGL, Game } from "phaser3";

const config = {
    type: WEBGL,
    width: 400,
    height: 300,
    scene: { preload, create, update },
    backgroundColor: "#555",
};

const game = new Game(config);

function preload() {
    console.log("preload");
}
function create() {}
function update() {}
@8Observer8 8Observer8 mentioned this issue Jun 17, 2024
Open
3 tasks
@photonstorm
Copy link
Collaborator

jsDelivr is taking a perfectly valid ESM module and then running it through Rollup and Terser again. For reasons best known only to them. I assume it's screwing-up Phaser in the process. Maybe this works on some projects, but I doubt it will on Phaser until we move to being a purely ESM based library.

@samme
Copy link
Contributor

samme commented Jun 17, 2024

You can use https://cdn.jsdelivr.net/npm/[email protected]/dist/phaser.esm.js etc. instead.

@8Observer8
Copy link
Author

8Observer8 commented Jun 17, 2024 •
edited
Loading

I prefer to use GitHub Pages because there are problems sometimes with UNPKG and jsDelivr. I have made this page for some libraries: https://8observer8.github.io/tutorials/setup/how-to-setup-js-libraries-as-es6-modules/public/index.html

Phaser 3:

You can use these links for @box2d/core:

GitHub Pages:

Skypack:

jsDelivr:

These links do not work:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@photonstorm @samme @8Observer8