Thanks to visit codestin.com
Credit goes to github.com

Skip to content

[AssetMapper] jQuery plugin fails locally but not remotely #52467

Closed
@tacman

Description

@tacman

Symfony version(s) affected

Assetmapper 6.4

Description

I'm trying to load a jquery plugin on datatables. I'm able to get it to work if the libraries are loaded remotely, but not when assetmapper copies them to the local directory. In throws a 404 related to jquery

image

How to reproduce

symfony new bug --webapp --version=next && cd bug
composer req symfony/asset-mapper
bin/console importmap:require datatables.net-bs5  datatables.net-select-bs5
bin/console make:controller AppController
sed -i "s|Route('/app'|Route('/'|" src/Controller/AppController.php

cat > assets/app.js <<'END'
import jquery from 'jquery'
import DataTables from 'datatables.net-bs5'
import 'datatables.net-select-bs5';
END
symfony server:start -d 
symfony open:local

I originally thought it was an issue with the datatables library, so I created an example script to show the problem, using the esm urls instead of the local files that assetmapper create, but I couldn't recreate the bug.

    <script type="importmap">
      {
    "imports": {
        "datatables.net-bs5": "https://cdn.jsdelivr.net/npm/[email protected]/+esm",
        "datatables.net-select-bs5": "https://cdn.jsdelivr.net/npm/[email protected]/+esm"

    }
}
</script>
    <script type="module">
      

      import DataTable from 'datatables.net-bs5'
        import 'datatables.net-select-bs5'
        console.log('datatables loaded.');
        let t = new DataTable('#example');
        /* console.log(t.id); */

    </script>

See https://jsfiddle.net/tacman1123/b2f3hj08/44/

I suspect this has something to do with the 'global' jquery, webpack had a autoProvideJquery() option to help with this. I'll also ask the library author, but since I can't provide a jsfiddle example of it not working, I'm wondering if perhaps it's related to AssetMapper.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions