If you liked what you've learned so far, dive in!
Subscribe to get access to this tutorial plus
video, code and script downloads.
With a Subscription, click any sentence in the script to jump to that part of the video!
Login SubscribeWe now have CSS - which we're building with Tailwind - we have JavaScript, we're bringing in third-party JavaScript, and we're using modern JavaScript syntax. Our app has everything that a real app has! Sure, it's kind of small, but we're almost ready to deploy it.
Before we do, let's do a quick audit on the assets that are inside AssetMapper. Find your terminal and run:
php bin/console debug:asset
This lists all of our asset paths, which includes our main asset path - assets/
- plus a few from bundles that have exposed their own directories. Below is a list of every file that will be exposed publicly.
We're running this command to see if there's anything in this list that we do not want to publicly expose. For example, this assets/styles/app.css
file. This is really a source file: it's not meant for the user to download directly. We're using Tailwind to build that into app.tailwind.css
, and that's what the user will download. It's not a huge deal that this is available publicly, but it's a good example of how we can hide "source" files that we don't want to expose.
Start by running
php bin/console config:dump framework asset_mapper
We're asking the system to give us example configuration for everything that can be configured under framework
, asset_mapper
. When we first installed AssetMapper, its recipe gave us a config/packages/asset_mapper.yaml
file. Here, we have framework
, asset_mapper
, and a key called paths
. When we run this command... sure enough, up here on top, it shows paths
. Below that, we have some other interesting things.
The first is excluded_patterns
. This is how we're going to hide certain files or paths - and we'll talk more about that in a minute. You can also control the public_prefix
, which is where your files are output to in the public/
directory.
This extensions
isn't super important... it's mostly just for the dev
environment... and there are a few other things like your importmap_path
, and even some attributes you can put on the <script>
tag that's dumped by the importmap()
function.
So there's some good stuff in here... but you won't need to worry about most of it, aside from excluded_patterns
.
Copy that key, spin over to asset_mapper.yaml
, and on the same level as paths
, paste. We want to exclude assets/styles/app.css
.
framework: | |
asset_mapper: | |
... lines 3 - 5 | |
excluded_patterns: | |
- 'assets/styles/app.css' |
But this isn't quite correct. To prove it, run
php bin/console debug:asset
again. If you look up... assets/styles/app.css
is still there! That's because excluded_patterns
is meant to be a glob. In other words, change this to */assets/styles/app.css
... and surround it by quotes.
framework: | |
asset_mapper: | |
... lines 3 - 5 | |
excluded_patterns: | |
- '*/assets/styles/app.css' |
This says that any "filesystem path" that ends with /assets/styles/app.css
will be ignored. And when we try the command again...
php bin/console debug:asset
Awesome. This is what we want to see. Every file here will be dumped into the /public/assets
directory. The fact that assets/styles/app.css
is not here means that it will not be dumped into the public/
directory.
I think it's time to deploy our site! Let's get a deploy set up next on platform.sh.
Hey @jmsche!
Ah yes - do not add excluded_patterns
if you're using the bundle. That bundle is slick: you DO want assets/styles/app.css
to be included in the asset mapper. The clever part from the bundle is that the contents of this are "intercepted" and the final, built contents are swapped in. So, assets/styles/app.css
is a mapped asset, but the contents are the compiled contents. Life is much easier with the bundle :).
Cheers!
// composer.json
{
"require": {
"php": ">=8.1",
"ext-ctype": "*",
"ext-iconv": "*",
"babdev/pagerfanta-bundle": "^4.0", // v4.2.0
"doctrine/doctrine-bundle": "^2.7", // 2.10.0
"doctrine/doctrine-migrations-bundle": "^3.2", // 3.2.4
"doctrine/orm": "^2.12", // 2.15.2
"knplabs/knp-time-bundle": "^1.18", // v1.20.0
"pagerfanta/doctrine-orm-adapter": "^4.0", // v4.1.0
"pagerfanta/twig": "^4.0", // v4.1.0
"stof/doctrine-extensions-bundle": "^1.7", // v1.7.1
"symfony/asset": "6.3.*", // v6.3.0
"symfony/asset-mapper": "6.3.*", // v6.3.0
"symfony/console": "6.3.*", // v6.3.0
"symfony/dotenv": "6.3.*", // v6.3.0
"symfony/flex": "^2", // v2.3.1
"symfony/framework-bundle": "6.3.*", // v6.3.0
"symfony/http-client": "6.3.*", // v6.3.0
"symfony/monolog-bundle": "^3.0", // v3.8.0
"symfony/proxy-manager-bridge": "6.3.*", // v6.3.0
"symfony/runtime": "6.3.*", // v6.3.0
"symfony/stimulus-bundle": "^2.9", // v2.9.1
"symfony/twig-bundle": "6.3.*", // v6.3.0
"symfony/ux-turbo": "^2.9", // v2.9.1
"symfony/web-link": "6.3.*", // v6.3.0
"symfony/yaml": "6.3.*", // v6.3.0
"twig/extra-bundle": "^2.12|^3.0", // v3.6.1
"twig/twig": "^2.12|^3.0" // v3.6.1
},
"require-dev": {
"doctrine/doctrine-fixtures-bundle": "^3.4", // 3.4.4
"symfony/debug-bundle": "6.3.*", // v6.3.0
"symfony/maker-bundle": "^1.41", // v1.49.0
"symfony/stopwatch": "6.3.*", // v6.3.0
"symfony/web-profiler-bundle": "6.3.*", // v6.3.0
"zenstruck/foundry": "^1.21" // v1.33.0
}
}
Hey, I don't know if it's because I use Tailwind bundle, but Tailwind styles are not loaded anymore (404) after applying the excluded_patterns config.
Did I miss something?