Adding new recipes for Encore, Stimulus & AssetMapper

README.rst

@@ -313,6 +313,44 @@ colors`_ are supported too:
 
       * <fg=blue>Read</> the documentation at <comment>https://symfony.com/doc</>
 
+``add-lines`` Configurator
+~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+If no other configurators can meet your needs, the ``add-lines`` configurator
+can add entire lines to files, either at the top, bottom or after a target:
+
+.. code-block:: json
+
+    "add-lines": [
+        {
+            "file": "webpack.config.js",
+            "content": "\nenables the Symfony UX Stimulus bridge (used in assets/bootstrap.js)\n    .enableStimulusBridge('./assets/controllers.json')",
+            "position": "after_target",
+            "target": ".splitEntryChunks()"
+        },
+        {
+            "file": "assets/app.js",
+            "content": "import './bootstrap.js';",
+            "position": "top",
+            "warn_if_missing": true
+        },
+        {
+            "file": "assets/translator.js",
+            "content": "export * from '../var/translations';",
+            "position": "bottom",
+            "requires": "symfony/webpack-encore-bundle"
+        }
+    ]
+
+Each item needs ``file``,  ``content`` and ``position``, which can be
+``top``, ``bottom`` or ``after_target``. If ``after_target`` is used, a
+``target`` must also be specified, which is a string that will be searched for
+in the file.
+
+If ``warn_if_missing`` is set to ``true``, a warning will be shown to the
+user if the ``file`` or ``target`` isn't found. If ``requires`` is set, the
+rule will only be applied if the given package is installed.
+
 Validation
 ----------
 

symfony/asset-mapper/6.3/assets/app.js

@@ -0,0 +1,7 @@
+/*
+ * Welcome to your app's main JavaScript file!
+ *
+ * This file will be included onto the page via the importmap() Twig function,
+ * which should already be in your base.html.twig.
+ */
+console.log('This log comes from assets/app.js - welcome to AssetMapper! 🎉')

symfony/asset-mapper/6.3/assets/styles/app.css

@@ -0,0 +1,3 @@
+body {
+    background-color: skyblue;
+}

symfony/asset-mapper/6.3/config/packages/asset_mapper.yaml

@@ -0,0 +1,5 @@
+framework:
+    asset_mapper:
+        # The paths to make available to the asset mapper.
+        paths:
+            - assets/

symfony/asset-mapper/6.3/importmap.php

@@ -0,0 +1,21 @@
+<?php
+
+/**
+ * Returns the import map for this application.
+ *
+ * - "path" is a path inside the asset mapper system. Use the
+ *     "debug:asset-map" command to see the full list of paths.
+ *
+ * - "preload" set to true for any modules that are loaded on the initial
+ *     page load to help the browser download them earlier.
+ *
+ * The "importmap:require" command can be used to add new entries to this file.
+ *
+ * This file has been auto-generated by the importmap commands.
+ */
+return [
+    'app' => [
+        'path' => 'app.js',
+        'preload' => true,
+    ],
+];

symfony/asset-mapper/6.3/manifest.json

@@ -0,0 +1,32 @@
+{
+    "copy-from-recipe": {
+        "assets/": "assets/",
+        "config/": "%CONFIG_DIR%/",
+        "importmap.php": "importmap.php"
+    },
+    "aliases": ["asset-mapper", "importmap"],
+    "gitignore": [
+        "/%PUBLIC_DIR%/assets/"
+    ],
+    "add-lines": [
+        {
+            "file": "templates/base.html.twig",
+            "content": "            {{ importmap() }}",
+            "position": "after_target",
+            "target": "{% block javascripts %}",
+            "warn_if_missing": true
+        },
+        {
+            "file": "templates/base.html.twig",
+            "content": "            <link rel=\"stylesheet\" href=\"{{ asset('styles/app.css') }}\">",
+            "position": "after_target",
+            "target": "{% block stylesheets %}",
+            "warn_if_missing": true
+        }
+    ],
+    "conflict": {
+        "symfony/framework-bundle": "<6.3",
+        "symfony/twig-bundle": "<6.3",
+        "symfony/flex": "<1.20.0 || >=2.0.0,<2.3.0"
+    }
+}

symfony/stimulus-bundle/2.9/assets/bootstrap.js

@@ -0,0 +1,2 @@
+// register any custom, 3rd party controllers here
+// app.register('some_controller_name', SomeImportedController);

symfony/stimulus-bundle/2.9/assets/controllers.json

@@ -0,0 +1,4 @@
+{
+    "controllers": [],
+    "entrypoints": []
+}

symfony/stimulus-bundle/2.9/assets/controllers/hello_controller.js

@@ -0,0 +1,16 @@
+import { Controller } from '@hotwired/stimulus';
+
+/*
+ * This is an example Stimulus controller!
+ *
+ * Any element with a data-controller="hello" attribute will cause
+ * this controller to be executed. The name "hello" comes from the filename:
+ * hello_controller.js -> "hello"
+ *
+ * Delete this file or adapt it for your use!
+ */
+export default class extends Controller {
+    connect() {
+        this.element.textContent = 'Hello Stimulus! Edit me in assets/controllers/hello_controller.js';
+    }
+}

symfony/stimulus-bundle/2.9/manifest.json

@@ -0,0 +1,46 @@
+{
+    "bundles": {
+        "Symfony\\UX\\StimulusBundle\\StimulusBundle": ["all"]
+    },
+    "copy-from-recipe": {
+        "assets/": "assets/"
+    },
+    "aliases": ["stimulus", "stimulus-bundle"],
+    "conflict": {
+        "symfony/webpack-encore-bundle": "<2.0",
+        "symfony/flex": "<1.20.0 || >=2.0.0,<2.3.0"
+    },
+    "add-lines": [
+        {
+            "file": "webpack.config.js",
+            "content": "\n    // enables the Symfony UX Stimulus bridge (used in assets/bootstrap.js)\n    .enableStimulusBridge('./assets/controllers.json')",
+            "position": "after_target",
+            "target": ".splitEntryChunks()"
+        },
+        {
+            "file": "assets/app.js",
+            "content": "import './bootstrap.js';",
+            "position": "top",
+            "warn_if_missing": true
+        },
+        {
+            "file": "assets/bootstrap.js",
+            "content": "import { startStimulusApp } from '@symfony/stimulus-bridge';\n\n// Registers Stimulus controllers from controllers.json and in the controllers/ directory\nexport const app = startStimulusApp(require.context(\n    '@symfony/stimulus-bridge/lazy-controller-loader!./controllers',\n    true,\n    /\\.[jt]sx?$/\n));",
+            "position": "top",
+            "requires": "symfony/webpack-encore-bundle"
+        },
+        {
+            "file": "assets/bootstrap.js",
+            "content": "import { startStimulusApp } from '@symfony/stimulus-bundle';\n\nconst app = startStimulusApp();",
+            "position": "top",
+            "requires": "symfony/asset-mapper"
+        },
+        {
+            "file": "templates/base.html.twig",
+            "content": "            {{ ux_controller_link_tags() }}",
+            "position": "after_target",
+            "target": "{% block stylesheets %}",
+            "warn_if_missing": true
+        }
+    ]
+}

symfony/twig-bundle/6.3/config/packages/twig.yaml

@@ -0,0 +1,6 @@
+twig:
+    default_path: '%kernel.project_dir%/templates'
+
+when@test:
+    twig:
+        strict_variables: true

symfony/twig-bundle/6.3/manifest.json

@@ -0,0 +1,12 @@
+{
+    "bundles": {
+        "Symfony\\Bundle\\TwigBundle\\TwigBundle": ["all"]
+    },
+    "copy-from-recipe": {
+        "config/": "%CONFIG_DIR%/",
+        "templates/": "templates/"
+    },
+    "conflict": {
+        "symfony/framework-bundle": "<5.3"
+    }
+}

symfony/twig-bundle/6.3/templates/base.html.twig

@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="UTF-8">
+        <title>{% block title %}Welcome!{% endblock %}</title>
+        <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 128 128%22><text y=%221.2em%22 font-size=%2296%22>⚫️</text></svg>">
+        {% block stylesheets %}
+        {% endblock %}
+
+        {% block javascripts %}
+        {% endblock %}
+    </head>
+    <body>
+        {% block body %}{% endblock %}
+    </body>
+</html>

symfony/ux-translator/2.9/assets/translator.js

@@ -0,0 +1,13 @@
+import { trans, getLocale, setLocale, setLocaleFallbacks } from '@symfony/ux-translator';
+/*
+ * This file is part of the Symfony UX Translator package.
+ *
+ * If folder "../var/translations" does not exist, or some translations are missing,
+ * you must warmup your Symfony cache to refresh JavaScript translations.
+ *
+ * If you use TypeScript, you can rename this file to "translator.ts" to take advantage of types checking.
+ */
+
+setLocaleFallbacks(localeFallbacks);
+
+export { trans };

symfony/ux-translator/2.9/config/packages/ux_translator.yaml

@@ -0,0 +1,3 @@
+ux_translator:
+    # The directory where the JavaScript translations are dumped
+    dump_directory: '%kernel.project_dir%/var/translations'

symfony/ux-translator/2.9/manifest.json

@@ -0,0 +1,39 @@
+{
+    "bundles": {
+        "Symfony\\UX\\Translator\\UxTranslatorBundle": ["all"]
+    },
+    "conflict": {
+        "symfony/flex": "<1.20.0 || >=2.0.0,<2.3.0"
+    },
+    "copy-from-recipe": {
+        "assets/": "assets/",
+        "config/": "%CONFIG_DIR%/",
+        "var/": "var/"
+    },
+    "add-lines": [
+        {
+            "file": "assets/translator.js",
+            "content": "import { localeFallbacks } from '../var/translations/configuration';",
+            "position": "top",
+            "requires": "symfony/webpack-encore-bundle"
+        },
+        {
+            "file": "assets/translator.js",
+            "content": "import { localeFallbacks } from '@app/translations/configuration';",
+            "position": "top",
+            "requires": "symfony/asset-mapper"
+        },
+        {
+            "file": "assets/translator.js",
+            "content": "export * from '../var/translations';",
+            "position": "bottom",
+            "requires": "symfony/webpack-encore-bundle"
+        },
+        {
+            "file": "assets/translator.js",
+            "content": "export * from '@app/translations';",
+            "position": "bottom",
+            "requires": "symfony/asset-mapper"
+        }
+    ]
+}

symfony/ux-translator/2.9/var/translations/configuration.js

@@ -0,0 +1,3 @@
+export const localeFallbacks = {};
+
+console.log('Run bin/console cache:warmup to generate the translation files.');

symfony/ux-translator/2.9/var/translations/index.js

@@ -0,0 +1 @@
+console.log('Run bin/console cache:warmup to generate the translation files.');

symfony/webpack-encore-bundle/1.10/manifest.json

@@ -8,7 +8,7 @@
         "package.json": "package.json",
         "webpack.config.js": "webpack.config.js"
     },
-    "aliases": ["ux", "encore", "webpack", "webpack-encore"],
+    "aliases": ["encore", "webpack", "webpack-encore"],
     "gitignore": [
         "/node_modules/",
         "/%PUBLIC_DIR%/build/",

symfony/webpack-encore-bundle/2.0/assets/app.js

@@ -0,0 +1,9 @@
+/*
+ * Welcome to your app's main JavaScript file!
+ *
+ * We recommend including the built version of this JavaScript file
+ * (and its CSS file) in your base layout (base.html.twig).
+ */
+
+// any CSS you import will output into a single css file (app.css in this case)
+import './styles/app.css';

symfony/webpack-encore-bundle/2.0/assets/styles/app.css

@@ -0,0 +1,3 @@
+body {
+    background-color: lightgray;
+}

symfony/webpack-encore-bundle/2.0/config/packages/webpack_encore.yaml

@@ -0,0 +1,45 @@
+webpack_encore:
+    # The path where Encore is building the assets - i.e. Encore.setOutputPath()
+    output_path: '%kernel.project_dir%/public/build'
+    # If multiple builds are defined (as shown below), you can disable the default build:
+    # output_path: false
+
+    # Set attributes that will be rendered on all script and link tags
+    script_attributes:
+        defer: true
+        # Uncomment (also under link_attributes) if using Turbo Drive
+        # https://turbo.hotwired.dev/handbook/drive#reloading-when-assets-change
+        # 'data-turbo-track': reload
+    # link_attributes:
+        # Uncomment if using Turbo Drive
+        # 'data-turbo-track': reload
+
+    # If using Encore.enableIntegrityHashes() and need the crossorigin attribute (default: false, or use 'anonymous' or 'use-credentials')
+    # crossorigin: 'anonymous'
+
+    # Preload all rendered script and link tags automatically via the HTTP/2 Link header
+    # preload: true
+
+    # Throw an exception if the entrypoints.json file is missing or an entry is missing from the data
+    # strict_mode: false
+
+    # If you have multiple builds:
+    # builds:
+        # frontend: '%kernel.project_dir%/public/frontend/build'
+
+        # pass the build name as the 3rd argument to the Twig functions
+        # {{ encore_entry_script_tags('entry1', null, 'frontend') }}
+
+framework:
+    assets:
+        json_manifest_path: '%kernel.project_dir%/public/build/manifest.json'
+
+#when@prod:
+#    webpack_encore:
+#        # Cache the entrypoints.json (rebuild Symfony's cache when entrypoints.json changes)
+#        # Available in version 1.2
+#        cache: true
+
+#when@test:
+#    webpack_encore:
+#        strict_mode: false

symfony/webpack-encore-bundle/2.0/manifest.json

@@ -0,0 +1,38 @@
+{
+    "bundles": {
+        "Symfony\\WebpackEncoreBundle\\WebpackEncoreBundle": ["all"]
+    },
+    "copy-from-recipe": {
+        "assets/": "assets/",
+        "config/": "%CONFIG_DIR%/",
+        "package.json": "package.json",
+        "webpack.config.js": "webpack.config.js"
+    },
+    "aliases": ["ux", "encore", "webpack", "webpack-encore"],
+    "gitignore": [
+        "/node_modules/",
+        "/%PUBLIC_DIR%/build/",
+        "npm-debug.log",
+        "yarn-error.log"
+    ],
+    "conflict": {
+        "symfony/framework-bundle": "<5.4",
+        "symfony/flex": "<1.20.0 || >=2.0.0,<2.3.0"
+    },
+    "add-lines": [
+        {
+            "file": "templates/base.html.twig",
+            "content": "            {{ encore_entry_script_tags('app') }}",
+            "position": "after_target",
+            "target": "{% block javascripts %}",
+            "warn_if_missing": true
+        },
+        {
+            "file": "templates/base.html.twig",
+            "content": "            {{ encore_entry_link_tags('app') }}",
+            "position": "after_target",
+            "target": "{% block stylesheets %}",
+            "warn_if_missing": true
+        }
+    ]
+}