Symfony 6.4 use encore webpack instead asset mapper

Question

In Symfony version 6.4 for using css and javascript is deault use symfony/asset-mapper. But in my application I try use Webpack Encore instead asset-mapper but in javasctipt console i see error

Failed to load module script: Expected a JavaScript module

How I completely disable asset-mapper or completely remove and use Webpack Encore?

Answer 1

Usually it's not more than:

composer remove symfony/asset-mapper.

and then:

composer require symfony/webpack-encore-bundle

Flex takes care of creating and deleting all the necessary files, and update the necessary templates.

I'm able to do this:

composer create-project symfony/skeleton:6.4.99 test-project
cd test-project
git init && git add . && git commit -m 'initial'
composer req webapp
git add . && git commit -m 'install webapp meta-pack'
composer remove symfony/asset-mapper
git add . && git commit -m 'remove asset-mapper'
composer req symfony/webpack-encore-bundle
git add . && git commit -m 'require webpack-encore'
npm install
git add . && git commit -m 'install node dependencies'

perfectly fine (I just copy-pasted the above on the terminal and ran it without issues).

The only I found to need doing after completing these steps is to remove assets/vendor. The mere existence of this directory and its contents shouldn't impact negatively your webpack-encore application, but they are not needed/used if you are not using the Asset Mapper component.

The two packages are mutually incompatible. If you install webpack-encore-bundle on top of a project that already includes asset-mapper, and then remove one of the two, the recipes may trip themselves, because they handle overlapping concerns, and leave you with a bit of a mess.