I'm posting this in case it helps anyone, but also for a sanity check (anyone has a better solution?).
My issue - using 3rd party packages and SCSS (and the solution in the docs)
Using Bootstrap as an example:
Running php bin/console importmap:require bootstrap doesn't import SCSS.
The easy provided alternative is installing as Composer package with composer require twbs/bootstrap, and importing the SCSS from there.
This happens to work for Bootstrap, but may not be an option for others (there may not be a composer package)
My alternative
CSS
- Install (at least these) third party packages using
npm like usual.
- In the app's SCSS file, import using the relative path to the node_modules's bootstrap:
@import '../../../node_modules/bootstrap/scss/bootstrap';
JS
- In
config/packages/asset_mapper.yaml add the path specifically for the third-party package to be included. My file is looking like this:
framework:
asset_mapper:
# The paths to make available to the asset mapper.
paths:
- assets/
- node_modules/bootstrap/dist/js
excluded_patterns:
- 'assets/styles/scss/**/*'
missing_import_mode: strict
when@prod:
framework:
asset_mapper:
missing_import_mode: warn
- In
importmap.php add the path ( and with entrypoint set to true). This only works because of the previous step.
return [
'app' => [
'path' => './assets/app.js',
'entrypoint' => true,
],
// ...
'bootstrap' => [
'path' => './node_modules/bootstrap/dist/js/bootstrap.bundle.min.js',
'entrypoint' => true,
],
];
- Import in the template as usual
{% block importmap %}
{{ importmap([
'bootstrap',
'app',
]) }}
{% endblock %}
To note that there is one positive type of gentrification that has appeared in Portugal. In the interior there are many small villages that are mostly empty and which have been a target for some richer immigrants.
Hotels and Airbnbs too, it's not an issue when most of the houses are empty anyway.