load and enable bootstrap framework

.gitignore

@@ -1,10 +1,13 @@
 # Uncomment to ignore Symfony project
 #/app/*
-/app/.yarncache
 !/app/.keep
 
 # Uncomment to ignore Database datas
-/data/*
-!/data/.keep
+data
 
+# yarn
+/app/.yarncache
+
+
+# phpstorm
 .idea

README.md

@@ -1,47 +1,111 @@
 Environnement de développement Docker pour démarrer un nouveau projet Symfony5
 ==================================
 
-# Présentation
+## En partant de la branche *5_start_new-project*
 
-L'objectif de ce dépôt est de proposer et de faire évoluer une configuration de départ pour démarrer très simplement un nouveau projet Symfony dans des conteneurs Docker.
+Le projet, symfony et ses dépendances sont prêt à être installé.
 
-En suivant pas-à-pas les instructions à partir du chapitre "Installation", on peut démarrer en quelques minutes un nouveau projet.
+```
+$ docker-compose build
+$ docker-compose up -d
+$ docker-compose exec -u 1000 php bash
+```
 
-Le dépôt propose plusieurs branches qui peuvent être utilisées selon le point de départ recherché:
+dans le conteneur php :
 
-## 1_docker_ready
+```
+$ composer install
+$ bin/console doctrine:schema:create
+```
 
-La branche `1_docker_ready` fournit juste le docker-compose.yml et les Dockerfile qui permettent de construire les conteneurs.
+et pour node :
 
-* `$ cd my-project-dir`
-* `$ docker-compose build`
-* `$ docker-compose up -d`
-* `$ docker-compose exec -u 1000 php bash`
+```
+$ bash docker-node.sh yarn install --force
+$ bash docker-node.sh yarn encore dev-server
+```
 
-A ce stade les commandes `composer` et `symfony` sont disponibles pour lancer la création du projet.
-Après ça on choisira dans le fichier `app/.env` le type de base de donnée. Un conteneur est prévu pour utiliser postgresql.
+Voilà, le site est disponible sur http://localhost:8000
 
-## 2_symfony_demo
 
-* commandes exécutées:
-   * `$ symfony new --demo demo`
-   * `$ mv demo/* . && mv demo/.* . && rmdir demo`
+## En partant de la branche *1_docker_ready*
 
-Cette branche démarre d'une installation toute prête de la demo Symfony. La db est enregistrée dans le repo dans un simple fichier sqlite (`app/data/database.sqlite`). Le conteneur docker postgresql est donc désactivé.
+### 1. Se mettre sur la bonne branche
 
-## 3_start_new_project
+```bash
+$ git co -b 1_docker_ready origin/1_docker_ready
+```
 
-* commandes exécutées:
-  * `$ symfony new myproject`
-  * `$ mv myproject/* . && mv myproject/.* . && rmdir myproject`
-  * `composer require annotations twig orm form form validator maker-bundle security-csrf \
-    && composer require --dev profiler`
-  * Adapt querystring in `./app/.env`:
-    ```
-    --- DATABASE_URL="postgresql://db_user:db_password@127.0.0.1:5432/db_name?serverVersion=13&charset=utf8"
-    +++ DATABASE_URL="postgresql://postgres:secret@db:5432/postgres?serverVersion=12&charset=utf8"
-    ```
-  * Create database schema: `bin/console doctrine:schema:create`
-  * `$ composer require symfony/webpack-encore-bundle` and `$ yarn install --force`
-  * `$ yarn add sass sass-loader`
-  * `$ composer require --dev symfony/debug-bundle symfony/var-dumper` 
+### 2. Construire les images et les conteneurs
+
+```bash
+$ docker-compose build
+$ docker-compose up
+ .. 221001_test3_db_1 exited with code 1
+```
+
+### 3. Parce que 'db' ne se lance pas:
+
+```bash
+$ docker-compose rm db
+$ sudo rm -rf ./data
+$ docker-compose up db
+```
+
+### 4. Entrer dans le conteneur php
+
+```bash
+$ docker-compose exec -u 1000 php bash
+```
+
+### 5. Créer le projet
+
+```bash
+$ symfony new project
+$ mv project/* . && mv project/.* . && rmdir project
+```
+
+### 6. Charger les dépendances de composer
+
+```bash
+$ composer require doctrine/annotations twig/twig doctrine/orm symfony/orm-pack symfony/form symfony/maker-bundle symfony/security-csrf
+```
+
+### 7. Connexion à postgresql
+
+modifier DATABASE_URL dans app/.env :
+```bash
++++ DATABASE_URL="postgresql://postgres:secret@db:5432/postgres?serverVersion=12&charset=utf8"
+```
+
+et dans le conteneur php :
+```bash
+$ bin/console doctrine:schema:create
+```
+
+### 8. Chargement de dépendances, la suite
+
+```bash
+$ composer require symfony/yaml symfony/twig-bridge symfony/validator
+
+$ composer require symfony/asset symfony/expression-language symfony/security-http symfony/translation symfony/web-link egulias/email-validator symfony/expression-language symfony/intl symfony/translation
+
+$ composer require --dev symfony/profiler-pack symfony/debug-bundle symfony/var-dumper
+```
+
+### 9. Installer node et yarn
+
+```bash
+$ composer require symfony/webpack-encore-bundle
+```
+
+mettre en place le script qui lance docker node, le lancer pour entrer dans le conteneur node:
+```bash
+$ yarn install --force
+$ yarn add sass sass-loader
+$ yarn encore dev-server
+```
+
+### 10. C'est installé !
+
+le site est disponible sur http://localhost:8000

app/.env

@@ -9,13 +9,14 @@
 # Real environment variables win over .env files.
 #
 # DO NOT DEFINE PRODUCTION SECRETS IN THIS FILE NOR IN ANY OTHER COMMITTED FILES.
+# https://symfony.com/doc/current/configuration/secrets.html
 #
 # Run "composer dump-env prod" to compile .env files for production use (requires symfony/flex >=1.2).
 # https://symfony.com/doc/current/best_practices.html#use-environment-variables-for-infrastructure-configuration
 
 ###> symfony/framework-bundle ###
 APP_ENV=dev
-APP_SECRET=d6c584c628f4a555632b6e2c1382502a
+APP_SECRET=0751e183ea472eb11c19f21f66a2543c
 ###< symfony/framework-bundle ###
 
 ###> doctrine/doctrine-bundle ###
@@ -23,6 +24,7 @@ APP_SECRET=d6c584c628f4a555632b6e2c1382502a
 # IMPORTANT: You MUST configure your server version, either here or in config/packages/doctrine.yaml
 #
 # DATABASE_URL="sqlite:///%kernel.project_dir%/var/data.db"
-# DATABASE_URL="mysql://db_user:db_password@127.0.0.1:3306/db_name?serverVersion=5.7"
+# DATABASE_URL="mysql://app:!ChangeMe!@127.0.0.1:3306/app?serverVersion=8&charset=utf8mb4"
+# DATABASE_URL="postgresql://app:!ChangeMe!@127.0.0.1:5432/app?serverVersion=14&charset=utf8"
 DATABASE_URL="postgresql://postgres:secret@db:5432/postgres?serverVersion=12&charset=utf8"
 ###< doctrine/doctrine-bundle ###

app/assets/app.js

@@ -6,10 +6,7 @@
  */
 
 // any CSS you import will output into a single css file (app.css in this case)
-import './styles/app.css';
-
-// SCSS
 import './styles/app.scss';
 
 // start the Stimulus application
-import './bootstrap';
+import './stimulus/bootstrap';

app/assets/stimulus/bootstrap.js

@@ -4,7 +4,7 @@ import { startStimulusApp } from '@symfony/stimulus-bridge';
 export const app = startStimulusApp(require.context(
     '@symfony/stimulus-bridge/lazy-controller-loader!./controllers',
     true,
-    /\.(j|t)sx?$/
+    /\.[jt]sx?$/
 ));
 
 // register any custom, 3rd party controllers here

app/assets/stimulus/controllers/hello_controller.js

@@ -1,4 +1,4 @@
-import { Controller } from 'stimulus';
+import { Controller } from '@hotwired/stimulus';
 
 /*
  * This is an example Stimulus controller!
@@ -11,6 +11,6 @@ import { Controller } from 'stimulus';
  */
 export default class extends Controller {
     connect() {
-        this.element.textContent = 'Hello Stimulus! Edit me in assets/controllers/hello_controller.js';
+        this.element.textContent = 'Hello Stimulus! Edit me in assets/stimulus/controllers/hello_controller.js';
     }
 }

app/assets/styles/_variables.scss

@@ -0,0 +1 @@
+$h1-font-size: 3.5rem; //bigger

app/assets/styles/app.css

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

app/assets/styles/app.scss

@@ -0,0 +1,16 @@
+// override bootstrap variables
+@import "_variables";
+
+// import Bootstrap 5 styles
+@import "~bootstrap/scss/bootstrap";
+
+
+body {
+    //background-color: lightgray;
+    //padding: 3em;
+    div#boum {
+      //background-color: white;
+      padding: 1em;
+      border: 1px solid grey;
+   }
+}

app/assets/vue/components/App.vue

@@ -0,0 +1,21 @@
+<template>
+   <div id="boum">
+      <div>hello <b>{{ username }}</b></div>
+      <div><b>{{ age }}</b> ans</div>
+      <input v-model="username">
+   </div>
+</template>
+
+<script>
+export default {
+   name: 'app',
+   props: ['dataset'],
+   data() {
+      return {
+         user: this.dataset.user,
+         username: this.dataset.user.username,
+         age: this.dataset.user.age,
+      }
+   }
+}
+</script>

app/assets/vue/index.js

@@ -0,0 +1,16 @@
+import { createApp } from 'vue'
+import App from './components/App.vue'
+
+const div = document.querySelector('div#app');
+console.log(div);
+
+const vue = createApp({
+    template: `<app :dataset="this.dataset" ></app>`,
+    data() {
+        return {
+            dataset: JSON.parse(div.dataset.app),
+        }
+    },
+})
+.component('app', App)
+.mount('#app');

app/bin/console

@@ -3,41 +3,15 @@
 
 use App\Kernel;
 use Symfony\Bundle\FrameworkBundle\Console\Application;
-use Symfony\Component\Console\Input\ArgvInput;
-use Symfony\Component\Dotenv\Dotenv;
-use Symfony\Component\ErrorHandler\Debug;
 
-if (!in_array(PHP_SAPI, ['cli', 'phpdbg', 'embed'], true)) {
-    echo 'Warning: The console should be invoked via the CLI version of PHP, not the '.PHP_SAPI.' SAPI'.PHP_EOL;
+if (!is_file(dirname(__DIR__).'/vendor/autoload_runtime.php')) {
+    throw new LogicException('Symfony Runtime is missing. Try running "composer require symfony/runtime".');
 }
 
-set_time_limit(0);
+require_once dirname(__DIR__).'/vendor/autoload_runtime.php';
 
-require dirname(__DIR__).'/vendor/autoload.php';
+return function (array $context) {
+    $kernel = new Kernel($context['APP_ENV'], (bool) $context['APP_DEBUG']);
 
-if (!class_exists(Application::class) || !class_exists(Dotenv::class)) {
-    throw new LogicException('You need to add "symfony/framework-bundle" and "symfony/dotenv" as Composer dependencies.');
-}
-
-$input = new ArgvInput();
-if (null !== $env = $input->getParameterOption(['--env', '-e'], null, true)) {
-    putenv('APP_ENV='.$_SERVER['APP_ENV'] = $_ENV['APP_ENV'] = $env);
-}
-
-if ($input->hasParameterOption('--no-debug', true)) {
-    putenv('APP_DEBUG='.$_SERVER['APP_DEBUG'] = $_ENV['APP_DEBUG'] = '0');
-}
-
-(new Dotenv())->bootEnv(dirname(__DIR__).'/.env');
-
-if ($_SERVER['APP_DEBUG']) {
-    umask(0000);
-
-    if (class_exists(Debug::class)) {
-        Debug::enable();
-    }
-}
-
-$kernel = new Kernel($_SERVER['APP_ENV'], (bool) $_SERVER['APP_DEBUG']);
-$application = new Application($kernel);
-$application->run($input);
+    return new Application($kernel);
+};

app/composer.json

@@ -1,33 +1,45 @@
 {
     "type": "project",
     "license": "proprietary",
-    "minimum-stability": "dev",
+    "minimum-stability": "stable",
     "prefer-stable": true,
     "require": {
         "php": ">=7.2.5",
         "ext-ctype": "*",
         "ext-iconv": "*",
-        "composer/package-versions-deprecated": "1.11.99.1",
-        "doctrine/doctrine-bundle": "^2.3",
-        "doctrine/doctrine-migrations-bundle": "^3.1",
-        "doctrine/orm": "^2.8",
-        "sensio/framework-extra-bundle": "^6.1",
-        "symfony/console": "5.2.*",
-        "symfony/dotenv": "5.2.*",
-        "symfony/flex": "^1.3.1",
-        "symfony/form": "5.2.*",
-        "symfony/framework-bundle": "5.2.*",
-        "symfony/maker-bundle": "^1.30",
-        "symfony/proxy-manager-bridge": "5.2.*",
-        "symfony/security-csrf": "5.2.*",
-        "symfony/twig-bundle": "5.2.*",
-        "symfony/validator": "5.2.*",
-        "symfony/webpack-encore-bundle": "^1.11",
-        "symfony/yaml": "5.2.*",
-        "twig/extra-bundle": "^2.12|^3.0",
-        "twig/twig": "^2.12|^3.0"
+        "doctrine/annotations": "^1.13",
+        "doctrine/doctrine-bundle": "^2.7",
+        "doctrine/doctrine-migrations-bundle": "^3.2",
+        "doctrine/orm": "^2.13",
+        "egulias/email-validator": "^3.2",
+        "sensio/framework-extra-bundle": "^6.2",
+        "symfony/asset": "^5.4",
+        "symfony/console": "5.4.*",
+        "symfony/dotenv": "5.4.*",
+        "symfony/expression-language": "^5.4",
+        "symfony/flex": "^1.17|^2",
+        "symfony/form": "^5.4",
+        "symfony/framework-bundle": "5.4.*",
+        "symfony/intl": "^5.4",
+        "symfony/maker-bundle": "^1.43",
+        "symfony/proxy-manager-bridge": "5.4.*",
+        "symfony/runtime": "5.4.*",
+        "symfony/security-csrf": "^5.4",
+        "symfony/security-http": "^5.4",
+        "symfony/translation": "^5.4",
+        "symfony/twig-bridge": "^5.4",
+        "symfony/validator": "^5.4",
+        "symfony/web-link": "^5.4",
+        "symfony/webpack-encore-bundle": "^1.15",
+        "symfony/yaml": "^5.4",
+        "twig/twig": "^3.4"
     },
     "config": {
+        "allow-plugins": {
+            "composer/package-versions-deprecated": true,
+            "symfony/flex": true,
+            "symfony/runtime": true
+        },
         "optimize-autoloader": true,
         "preferred-install": {
             "*": "dist"
@@ -67,13 +79,13 @@
     "extra": {
         "symfony": {
             "allow-contrib": false,
-            "require": "5.2.*"
+            "require": "5.4.*"
         }
     },
     "require-dev": {
-        "symfony/debug-bundle": "5.2.*",
-        "symfony/stopwatch": "^5.2",
-        "symfony/var-dumper": "5.2.*",
-        "symfony/web-profiler-bundle": "^5.2"
+        "symfony/debug-bundle": "^5.4",
+        "symfony/stopwatch": "5.4.*",
+        "symfony/var-dumper": "^5.4",
+        "symfony/web-profiler-bundle": "5.4.*"
     }
 }

app/config/bundles.php

@@ -2,13 +2,12 @@
 
 return [
     Symfony\Bundle\FrameworkBundle\FrameworkBundle::class => ['all' => true],
-    Sensio\Bundle\FrameworkExtraBundle\SensioFrameworkExtraBundle::class => ['all' => true],
     Symfony\Bundle\MakerBundle\MakerBundle::class => ['dev' => true],
     Doctrine\Bundle\DoctrineBundle\DoctrineBundle::class => ['all' => true],
     Doctrine\Bundle\MigrationsBundle\DoctrineMigrationsBundle::class => ['all' => true],
+    Symfony\Bundle\DebugBundle\DebugBundle::class => ['dev' => true],
     Symfony\Bundle\TwigBundle\TwigBundle::class => ['all' => true],
-    Twig\Extra\TwigExtraBundle\TwigExtraBundle::class => ['all' => true],
     Symfony\Bundle\WebProfilerBundle\WebProfilerBundle::class => ['dev' => true, 'test' => true],
     Symfony\WebpackEncoreBundle\WebpackEncoreBundle::class => ['all' => true],
-    Symfony\Bundle\DebugBundle\DebugBundle::class => ['dev' => true, 'test' => true],
+    Sensio\Bundle\FrameworkExtraBundle\SensioFrameworkExtraBundle::class => ['all' => true],
 ];

app/config/packages/assets.yaml

@@ -1,3 +0,0 @@
-framework:
-    assets:
-        json_manifest_path: '%kernel.project_dir%/public/build/manifest.json'

app/config/packages/debug.yaml

@@ -0,0 +1,5 @@
+when@dev:
+    debug:
+        # Forwards VarDumper Data clones to a centralized server allowing to inspect dumps on CLI or in your browser.
+        # See the "server:dump" command to start a new server.
+        dump_destination: "tcp://%env(VAR_DUMPER_SERVER)%"

app/config/packages/dev/debug.yaml

@@ -1,4 +0,0 @@
-debug:
-    # Forwards VarDumper Data clones to a centralized server allowing to inspect dumps on CLI or in your browser.
-    # See the "server:dump" command to start a new server.
-    dump_destination: "tcp://%env(VAR_DUMPER_SERVER)%"

app/config/packages/dev/web_profiler.yaml

@@ -1,6 +0,0 @@
-web_profiler:
-    toolbar: true
-    intercept_redirects: false
-
-framework:
-    profiler: { only_exceptions: false }

app/config/packages/doctrine.yaml

@@ -1,6 +1,5 @@
 doctrine:
     dbal:
-        override_url: true
         url: '%env(resolve:DATABASE_URL)%'
 
         # IMPORTANT: You MUST configure your server version,
@@ -13,7 +12,31 @@ doctrine:
         mappings:
             App:
                 is_bundle: false
-                type: annotation
                 dir: '%kernel.project_dir%/src/Entity'
                 prefix: 'App\Entity'
                 alias: App
+
+when@test:
+    doctrine:
+        dbal:
+            # "TEST_TOKEN" is typically set by ParaTest
+            dbname_suffix: '_test%env(default::TEST_TOKEN)%'
+
+when@prod:
+    doctrine:
+        orm:
+            auto_generate_proxy_classes: false
+            query_cache_driver:
+                type: pool
+                pool: doctrine.system_cache_pool
+            result_cache_driver:
+                type: pool
+                pool: doctrine.result_cache_pool
+
+    framework:
+        cache:
+            pools:
+                doctrine.result_cache_pool:
+                    adapter: cache.app
+                doctrine.system_cache_pool:
+                    adapter: cache.system

app/config/packages/doctrine_migrations.yaml

@@ -3,4 +3,4 @@ doctrine_migrations:
         # namespace is arbitrary but should be different from App\Migrations
         # as migrations classes should NOT be autoloaded
         'DoctrineMigrations': '%kernel.project_dir%/migrations'
-    enable_profiler: '%kernel.debug%'
+    enable_profiler: false

app/config/packages/framework.yaml

@@ -2,7 +2,7 @@
 framework:
     secret: '%env(APP_SECRET)%'
     #csrf_protection: true
-    #http_method_override: true
+    http_method_override: false
 
     # Enables session support. Note that the session will ONLY be started if you read or write from it.
     # Remove or comment this section to explicitly disable session support.
@@ -10,8 +10,15 @@ framework:
         handler_id: null
         cookie_secure: auto
         cookie_samesite: lax
+        storage_factory_id: session.storage.factory.native
 
     #esi: true
     #fragments: true
     php_errors:
         log: true
+
+when@test:
+    framework:
+        test: true
+        session:
+            storage_factory_id: session.storage.factory.mock_file

app/config/packages/prod/doctrine.yaml

@@ -1,20 +0,0 @@
-doctrine:
-    orm:
-        auto_generate_proxy_classes: false
-        metadata_cache_driver:
-            type: pool
-            pool: doctrine.system_cache_pool
-        query_cache_driver:
-            type: pool
-            pool: doctrine.system_cache_pool
-        result_cache_driver:
-            type: pool
-            pool: doctrine.result_cache_pool
-
-framework:
-    cache:
-        pools:
-            doctrine.result_cache_pool:
-                adapter: cache.app
-            doctrine.system_cache_pool:
-                adapter: cache.system

app/config/packages/prod/routing.yaml

@@ -1,3 +0,0 @@
-framework:
-    router:
-        strict_requirements: null

app/config/packages/prod/webpack_encore.yaml

@@ -1,4 +0,0 @@
-#webpack_encore:
-    # Cache the entrypoints.json (rebuild Symfony's cache when entrypoints.json changes)
-    # Available in version 1.2
-    #cache: true

app/config/packages/routing.yaml

@@ -5,3 +5,8 @@ framework:
         # Configure how to generate URLs in non-HTTP contexts, such as CLI commands.
         # See https://symfony.com/doc/current/routing.html#generating-urls-in-commands
         #default_uri: http://localhost
+
+when@prod:
+    framework:
+        router:
+            strict_requirements: null

app/config/packages/test/doctrine.yaml

@@ -1,7 +0,0 @@
-#doctrine:
-#    dbal:
-#        # Overrides the database name in the test environment only
-#        # "host", "port", "user", & "password" can also be set to override their respective url parts
-#        #
-#        # If you're using ParaTest, "TEST_TOKEN" is set by ParaTest otherwise nothing is appended to the database name.
-#        dbname: main_test%env(default::TEST_TOKEN)%

app/config/packages/test/framework.yaml

@@ -1,4 +0,0 @@
-framework:
-    test: true
-    session:
-        storage_id: session.storage.mock_file

app/config/packages/test/twig.yaml

@@ -1,2 +0,0 @@
-twig:
-    strict_variables: true

app/config/packages/test/validator.yaml

@@ -1,3 +0,0 @@
-framework:
-    validation:
-        not_compromised_password: false

app/config/packages/test/web_profiler.yaml

@@ -1,6 +0,0 @@
-web_profiler:
-    toolbar: false
-    intercept_redirects: false
-
-framework:
-    profiler: { collect: false }

app/config/packages/test/webpack_encore.yaml

@@ -1,2 +0,0 @@
-#webpack_encore:
-#    strict_mode: false

app/config/packages/translation.yaml

@@ -0,0 +1,13 @@
+framework:
+    default_locale: en
+    translator:
+        default_path: '%kernel.project_dir%/translations'
+        fallbacks:
+            - en
+#        providers:
+#            crowdin:
+#                dsn: '%env(CROWDIN_DSN)%'
+#            loco:
+#                dsn: '%env(LOCO_DSN)%'
+#            lokalise:
+#                dsn: '%env(LOKALISE_DSN)%'

app/config/packages/twig.yaml

@@ -1,2 +1,7 @@
 twig:
     default_path: '%kernel.project_dir%/templates'
+    form_themes: ['bootstrap_5_layout.html.twig']
+
+when@test:
+    twig:
+        strict_variables: true

app/config/packages/validator.yaml

@@ -6,3 +6,8 @@ framework:
         # For instance, basic validation constraints will be inferred from Doctrine's metadata.
         #auto_mapping:
         #    App\Entity\: []
+
+when@test:
+    framework:
+        validation:
+            not_compromised_password: false

app/config/packages/web_profiler.yaml

@@ -0,0 +1,15 @@
+when@dev:
+    web_profiler:
+        toolbar: true
+        intercept_redirects: false
+
+    framework:
+        profiler: { only_exceptions: false }
+
+when@test:
+    web_profiler:
+        toolbar: false
+        intercept_redirects: false
+
+    framework:
+        profiler: { collect: false }

app/config/packages/webpack_encore.yaml

@@ -7,7 +7,12 @@ webpack_encore:
     # 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'
@@ -28,3 +33,17 @@ webpack_encore:
     # Cache the entrypoints.json (rebuild Symfony's cache when entrypoints.json changes)
     # Put in config/packages/prod/webpack_encore.yaml
     # cache: true
+
+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

app/config/routes/dev/framework.yaml

@@ -1,3 +0,0 @@
-_errors:
-    resource: '@FrameworkBundle/Resources/config/routing/errors.xml'
-    prefix: /_error

app/config/routes/dev/web_profiler.yaml

@@ -1,7 +0,0 @@
-web_profiler_wdt:
-    resource: '@WebProfilerBundle/Resources/config/routing/wdt.xml'
-    prefix: /_wdt
-
-web_profiler_profiler:
-    resource: '@WebProfilerBundle/Resources/config/routing/profiler.xml'
-    prefix: /_profiler

app/config/routes/framework.yaml

@@ -0,0 +1,4 @@
+when@dev:
+    _errors:
+        resource: '@FrameworkBundle/Resources/config/routing/errors.xml'
+        prefix: /_error

app/config/routes/web_profiler.yaml

@@ -0,0 +1,8 @@
+when@dev:
+    web_profiler_wdt:
+        resource: '@WebProfilerBundle/Resources/config/routing/wdt.xml'
+        prefix: /_wdt
+
+    web_profiler_profiler:
+        resource: '@WebProfilerBundle/Resources/config/routing/profiler.xml'
+        prefix: /_profiler

app/config/services.yaml

@@ -2,7 +2,7 @@
 # Files in the packages/ subdirectory configure your dependencies.
 
 # Put parameters here that don't need to change on each machine where the app is deployed
-# https://symfony.com/doc/current/best_practices/configuration.html#application-related-configuration
+# https://symfony.com/doc/current/best_practices.html#use-parameters-for-application-configuration
 parameters:
 
 services:
@@ -19,13 +19,6 @@ services:
             - '../src/DependencyInjection/'
             - '../src/Entity/'
             - '../src/Kernel.php'
-            - '../src/Tests/'
-
-    # controllers are imported separately to make sure services can be injected
-    # as action arguments even if you don't extend any base controller class
-    App\Controller\:
-        resource: '../src/Controller/'
-        tags: ['controller.service_arguments']
 
     # add more service definitions when explicit configuration is needed
     # please note that last definitions always *replace* previous ones

app/docker-compose.override.yml

@@ -0,0 +1,8 @@
+version: '3'
+
+services:
+###> doctrine/doctrine-bundle ###
+  database:
+    ports:
+      - "5432"
+###< doctrine/doctrine-bundle ###

app/docker-compose.yml

@@ -0,0 +1,21 @@
+version: '3'
+
+services:
+###> doctrine/doctrine-bundle ###
+  database:
+    image: postgres:${POSTGRES_VERSION:-14}-alpine
+    environment:
+      POSTGRES_DB: ${POSTGRES_DB:-app}
+      # You should definitely change the password in production
+      POSTGRES_PASSWORD: ${POSTGRES_PASSWORD:-!ChangeMe!}
+      POSTGRES_USER: ${POSTGRES_USER:-app}
+    volumes:
+      - db-data:/var/lib/postgresql/data:rw
+      # You may use a bind-mounted host directory instead, so that it is harder to accidentally remove the volume and lose all your data!
+      # - ./docker/db/data:/var/lib/postgresql/data:rw
+###< doctrine/doctrine-bundle ###
+
+volumes:
+###> doctrine/doctrine-bundle ###
+  db-data:
+###< doctrine/doctrine-bundle ###

app/package.json

@@ -1,11 +1,16 @@
 {
     "devDependencies": {
-        "@symfony/stimulus-bridge": "^2.0.0",
-        "@symfony/webpack-encore": "^1.0.0",
-        "core-js": "^3.0.0",
-        "regenerator-runtime": "^0.13.2",
-        "stimulus": "^2.0.0",
-        "webpack-notifier": "^1.6.0"
+        "@babel/core": "^7.17.0",
+        "@babel/preset-env": "^7.16.0",
+        "@hotwired/stimulus": "^3.0.0",
+        "@symfony/stimulus-bridge": "^3.2.0",
+        "@symfony/webpack-encore": "^4.0.0",
+        "bootstrap": "^5.2.1",
+        "core-js": "^3.23.0",
+        "regenerator-runtime": "^0.13.9",
+        "webpack": "^5.74.0",
+        "webpack-cli": "^4.10.0",
+        "webpack-notifier": "^1.15.0"
     },
     "license": "UNLICENSED",
     "private": true,
@@ -16,7 +21,12 @@
         "build": "encore production --progress"
     },
     "dependencies": {
-        "sass": "^1.32.10",
-        "sass-loader": "^11.0.1"
+        "sass": "^1.55.0",
+        "sass-loader": "^13.0.2",
+        "vue": "^3.2.40",
+        "vue-cli": "^2.9.6",
+        "vue-loader": "^17.0.0",
+        "vue-resource": "^1.5.3",
+        "vue-template-compiler": "^2.7.10"
     }
 }

app/public/index.php

@@ -1,22 +1,9 @@
 <?php
 
 use App\Kernel;
-use Symfony\Component\Dotenv\Dotenv;
-use Symfony\Component\ErrorHandler\Debug;
-use Symfony\Component\HttpFoundation\Request;
 
-require dirname(__DIR__).'/vendor/autoload.php';
+require_once dirname(__DIR__).'/vendor/autoload_runtime.php';
 
-(new Dotenv())->bootEnv(dirname(__DIR__).'/.env');
-
-if ($_SERVER['APP_DEBUG']) {
-    umask(0000);
-
-    Debug::enable();
-}
-
-$kernel = new Kernel($_SERVER['APP_ENV'], (bool) $_SERVER['APP_DEBUG']);
-$request = Request::createFromGlobals();
-$response = $kernel->handle($request);
-$response->send();
-$kernel->terminate($request, $response);
+return function (array $context) {
+    return new Kernel($context['APP_ENV'], (bool) $context['APP_DEBUG']);
+};

app/src/Controller/VueController.php

@@ -0,0 +1,26 @@
+<?php
+
+namespace App\Controller;
+
+use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+use Symfony\Component\HttpFoundation\Response;
+use Symfony\Component\Routing\Annotation\Route;
+
+class VueController extends AbstractController
+{
+    /**
+     * @Route("/vue", name="app_vue")
+     */
+    public function index(): Response
+    {
+        return $this->render('vue/index.html.twig', [
+            'controller_name' => 'VueController',
+            'data' => [
+               'user' => [
+                  'username' => 'Charles',
+                  'age' => 31
+               ]
+            ]
+        ]);
+    }
+}

app/src/Kernel.php

@@ -3,36 +3,9 @@
 namespace App;
 
 use Symfony\Bundle\FrameworkBundle\Kernel\MicroKernelTrait;
-use Symfony\Component\DependencyInjection\Loader\Configurator\ContainerConfigurator;
 use Symfony\Component\HttpKernel\Kernel as BaseKernel;
-use Symfony\Component\Routing\Loader\Configurator\RoutingConfigurator;
 
 class Kernel extends BaseKernel
 {
     use MicroKernelTrait;
-
-    protected function configureContainer(ContainerConfigurator $container): void
-    {
-        $container->import('../config/{packages}/*.yaml');
-        $container->import('../config/{packages}/'.$this->environment.'/*.yaml');
-
-        if (is_file(\dirname(__DIR__).'/config/services.yaml')) {
-            $container->import('../config/services.yaml');
-            $container->import('../config/{services}_'.$this->environment.'.yaml');
-        } elseif (is_file($path = \dirname(__DIR__).'/config/services.php')) {
-            (require $path)($container->withPath($path), $this);
-        }
-    }
-
-    protected function configureRoutes(RoutingConfigurator $routes): void
-    {
-        $routes->import('../config/{routes}/'.$this->environment.'/*.yaml');
-        $routes->import('../config/{routes}/*.yaml');
-
-        if (is_file(\dirname(__DIR__).'/config/routes.yaml')) {
-            $routes->import('../config/routes.yaml');
-        } elseif (is_file($path = \dirname(__DIR__).'/config/routes.php')) {
-            (require $path)($routes->withPath($path), $this);
-        }
-    }
 }

app/symfony.lock

@@ -1,12 +1,9 @@
 {
-    "composer/package-versions-deprecated": {
-        "version": "1.11.99.1"
-    },
     "doctrine/annotations": {
-        "version": "1.0",
+        "version": "1.13",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
+            "branch": "main",
             "version": "1.0",
             "ref": "a2759dd6123694c8d901d0ec80006e044c2e6457"
         },
@@ -14,106 +11,38 @@
             "config/routes/annotations.yaml"
         ]
     },
-    "doctrine/cache": {
-        "version": "1.10.2"
-    },
-    "doctrine/collections": {
-        "version": "1.6.7"
-    },
-    "doctrine/common": {
-        "version": "3.1.2"
-    },
-    "doctrine/dbal": {
-        "version": "2.13.0"
-    },
-    "doctrine/deprecations": {
-        "version": "v0.5.3"
-    },
     "doctrine/doctrine-bundle": {
-        "version": "2.3",
+        "version": "2.7",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
-            "version": "2.3",
-            "ref": "6e0f582596a8f1c865aaa0d3cceb9bf0daf609b4"
+            "branch": "main",
+            "version": "2.4",
+            "ref": "da713d006953b90d1c085c1be480ecdd6c4a95e0"
         },
         "files": [
             "config/packages/doctrine.yaml",
-            "config/packages/prod/doctrine.yaml",
-            "config/packages/test/doctrine.yaml",
             "src/Entity/.gitignore",
             "src/Repository/.gitignore"
         ]
     },
     "doctrine/doctrine-migrations-bundle": {
-        "version": "3.1",
+        "version": "3.2",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
+            "branch": "main",
             "version": "3.1",
-            "ref": "ee609429c9ee23e22d6fa5728211768f51ed2818"
+            "ref": "1d01ec03c6ecbd67c3375c5478c9a423ae5d6a33"
         },
         "files": [
             "config/packages/doctrine_migrations.yaml",
             "migrations/.gitignore"
         ]
     },
-    "doctrine/event-manager": {
-        "version": "1.1.1"
-    },
-    "doctrine/inflector": {
-        "version": "2.0.3"
-    },
-    "doctrine/instantiator": {
-        "version": "1.4.0"
-    },
-    "doctrine/lexer": {
-        "version": "1.2.1"
-    },
-    "doctrine/migrations": {
-        "version": "3.1.1"
-    },
-    "doctrine/orm": {
-        "version": "2.8.4"
-    },
-    "doctrine/persistence": {
-        "version": "2.1.0"
-    },
-    "doctrine/sql-formatter": {
-        "version": "1.1.1"
-    },
-    "friendsofphp/proxy-manager-lts": {
-        "version": "v1.0.3"
-    },
-    "laminas/laminas-code": {
-        "version": "3.4.1"
-    },
-    "laminas/laminas-eventmanager": {
-        "version": "3.3.1"
-    },
-    "laminas/laminas-zendframework-bridge": {
-        "version": "1.2.0"
-    },
-    "nikic/php-parser": {
-        "version": "v4.10.4"
-    },
-    "psr/cache": {
-        "version": "1.0.1"
-    },
-    "psr/container": {
-        "version": "1.1.1"
-    },
-    "psr/event-dispatcher": {
-        "version": "1.0.0"
-    },
-    "psr/log": {
-        "version": "1.1.3"
-    },
     "sensio/framework-extra-bundle": {
-        "version": "5.2",
+        "version": "6.2",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
+            "branch": "main",
             "version": "5.2",
             "ref": "fb7e19da7f013d0d422fa9bce16f5c510e27609b"
         },
@@ -121,253 +50,141 @@
             "config/packages/sensio_framework_extra.yaml"
         ]
     },
-    "symfony/asset": {
-        "version": "v5.2.4"
-    },
-    "symfony/cache": {
-        "version": "v5.2.6"
-    },
-    "symfony/cache-contracts": {
-        "version": "v2.2.0"
-    },
-    "symfony/config": {
-        "version": "v5.2.4"
-    },
     "symfony/console": {
-        "version": "5.1",
+        "version": "5.4",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
-            "version": "5.1",
-            "ref": "c6d02bdfba9da13c22157520e32a602dbee8a75c"
+            "branch": "main",
+            "version": "5.3",
+            "ref": "da0c8be8157600ad34f10ff0c9cc91232522e047"
         },
         "files": [
             "bin/console"
         ]
     },
     "symfony/debug-bundle": {
-        "version": "4.1",
+        "version": "5.4",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
-            "version": "4.1",
-            "ref": "f8863cbad2f2e58c4b65fa1eac892ab189971bea"
+            "branch": "main",
+            "version": "5.3",
+            "ref": "5aa8aa48234c8eb6dbdd7b3cd5d791485d2cec4b"
         },
         "files": [
-            "config/packages/dev/debug.yaml"
+            "config/packages/debug.yaml"
         ]
     },
-    "symfony/dependency-injection": {
-        "version": "v5.2.6"
-    },
-    "symfony/deprecation-contracts": {
-        "version": "v2.2.0"
-    },
-    "symfony/doctrine-bridge": {
-        "version": "v5.2.6"
-    },
-    "symfony/dotenv": {
-        "version": "v5.2.4"
-    },
-    "symfony/error-handler": {
-        "version": "v5.2.6"
-    },
-    "symfony/event-dispatcher": {
-        "version": "v5.2.4"
-    },
-    "symfony/event-dispatcher-contracts": {
-        "version": "v2.2.0"
-    },
-    "symfony/filesystem": {
-        "version": "v5.2.6"
-    },
-    "symfony/finder": {
-        "version": "v5.2.4"
-    },
     "symfony/flex": {
-        "version": "1.0",
+        "version": "1.19",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
+            "branch": "main",
             "version": "1.0",
-            "ref": "c0eeb50665f0f77226616b6038a9b06c03752d8e"
+            "ref": "146251ae39e06a95be0fe3d13c807bcf3938b172"
         },
         "files": [
             ".env"
         ]
     },
-    "symfony/form": {
-        "version": "v5.2.6"
-    },
     "symfony/framework-bundle": {
-        "version": "5.2",
+        "version": "5.4",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
-            "version": "5.2",
-            "ref": "6ec87563dcc85cd0c48856dcfbfc29610506d250"
+            "branch": "main",
+            "version": "5.4",
+            "ref": "3cd216a4d007b78d8554d44a5b1c0a446dab24fb"
         },
         "files": [
             "config/packages/cache.yaml",
             "config/packages/framework.yaml",
-            "config/packages/test/framework.yaml",
             "config/preload.php",
-            "config/routes/dev/framework.yaml",
+            "config/routes/framework.yaml",
             "config/services.yaml",
             "public/index.php",
             "src/Controller/.gitignore",
             "src/Kernel.php"
         ]
     },
-    "symfony/http-client-contracts": {
-        "version": "v2.3.1"
-    },
-    "symfony/http-foundation": {
-        "version": "v5.2.4"
-    },
-    "symfony/http-kernel": {
-        "version": "v5.2.6"
-    },
-    "symfony/intl": {
-        "version": "v5.2.4"
-    },
     "symfony/maker-bundle": {
-        "version": "1.0",
+        "version": "1.43",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
+            "branch": "main",
             "version": "1.0",
             "ref": "fadbfe33303a76e25cb63401050439aa9b1a9c7f"
         }
     },
-    "symfony/options-resolver": {
-        "version": "v5.2.4"
-    },
-    "symfony/orm-pack": {
-        "version": "v2.1.0"
-    },
-    "symfony/polyfill-intl-grapheme": {
-        "version": "v1.22.1"
-    },
-    "symfony/polyfill-intl-icu": {
-        "version": "v1.22.1"
-    },
-    "symfony/polyfill-intl-normalizer": {
-        "version": "v1.22.1"
-    },
-    "symfony/polyfill-mbstring": {
-        "version": "v1.22.1"
-    },
-    "symfony/polyfill-php73": {
-        "version": "v1.22.1"
-    },
-    "symfony/polyfill-php80": {
-        "version": "v1.22.1"
-    },
-    "symfony/profiler-pack": {
-        "version": "v1.0.5"
-    },
-    "symfony/property-access": {
-        "version": "v5.2.4"
-    },
-    "symfony/property-info": {
-        "version": "v5.2.4"
-    },
-    "symfony/proxy-manager-bridge": {
-        "version": "v5.2.4"
-    },
     "symfony/routing": {
-        "version": "5.1",
+        "version": "5.4",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
-            "version": "5.1",
-            "ref": "b4f3e7c95e38b606eef467e8a42a8408fc460c43"
+            "branch": "main",
+            "version": "5.3",
+            "ref": "85de1d8ae45b284c3c84b668171d2615049e698f"
         },
         "files": [
-            "config/packages/prod/routing.yaml",
             "config/packages/routing.yaml",
             "config/routes.yaml"
         ]
     },
-    "symfony/security-core": {
-        "version": "v5.2.6"
-    },
-    "symfony/security-csrf": {
-        "version": "v5.2.4"
-    },
-    "symfony/service-contracts": {
-        "version": "v2.2.0"
-    },
-    "symfony/stopwatch": {
-        "version": "v5.2.4"
-    },
-    "symfony/string": {
-        "version": "v5.2.6"
-    },
-    "symfony/translation-contracts": {
-        "version": "v2.3.0"
-    },
-    "symfony/twig-bridge": {
-        "version": "v5.2.6"
-    },
-    "symfony/twig-bundle": {
-        "version": "5.0",
+    "symfony/translation": {
+        "version": "5.4",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
-            "version": "5.0",
-            "ref": "fab9149bbaa4d5eca054ed93f9e1b66cc500895d"
+            "branch": "main",
+            "version": "5.3",
+            "ref": "da64f5a2b6d96f5dc24914517c0350a5f91dee43"
+        },
+        "files": [
+            "config/packages/translation.yaml",
+            "translations/.gitignore"
+        ]
+    },
+    "symfony/twig-bundle": {
+        "version": "5.4",
+        "recipe": {
+            "repo": "github.com/symfony/recipes",
+            "branch": "main",
+            "version": "5.4",
+            "ref": "bb2178c57eee79e6be0b297aa96fc0c0def81387"
         },
         "files": [
-            "config/packages/test/twig.yaml",
             "config/packages/twig.yaml",
             "templates/base.html.twig"
         ]
     },
-    "symfony/twig-pack": {
-        "version": "v1.0.1"
-    },
     "symfony/validator": {
-        "version": "4.3",
+        "version": "5.4",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
-            "version": "4.3",
-            "ref": "d902da3e4952f18d3bf05aab29512eb61cabd869"
+            "branch": "main",
+            "version": "5.3",
+            "ref": "c32cfd98f714894c4f128bb99aa2530c1227603c"
         },
         "files": [
-            "config/packages/test/validator.yaml",
             "config/packages/validator.yaml"
         ]
     },
-    "symfony/var-dumper": {
-        "version": "v5.2.6"
-    },
-    "symfony/var-exporter": {
-        "version": "v5.2.4"
-    },
     "symfony/web-profiler-bundle": {
-        "version": "3.3",
+        "version": "5.4",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
-            "version": "3.3",
-            "ref": "6bdfa1a95f6b2e677ab985cd1af2eae35d62e0f6"
+            "branch": "main",
+            "version": "5.3",
+            "ref": "24bbc3d84ef2f427f82104f766014e799eefcc3e"
         },
         "files": [
-            "config/packages/dev/web_profiler.yaml",
-            "config/packages/test/web_profiler.yaml",
-            "config/routes/dev/web_profiler.yaml"
+            "config/packages/web_profiler.yaml",
+            "config/routes/web_profiler.yaml"
         ]
     },
     "symfony/webpack-encore-bundle": {
-        "version": "1.9",
+        "version": "1.15",
         "recipe": {
             "repo": "github.com/symfony/recipes",
-            "branch": "master",
-            "version": "1.9",
-            "ref": "9399a0bfc6ee7a0c019f952bca46d6a6045dd451"
+            "branch": "main",
+            "version": "1.10",
+            "ref": "51fec8b86251b9bfc126ebc1827c9a02fa81ee81"
         },
         "files": [
             "assets/app.js",
@@ -375,21 +192,9 @@
             "assets/controllers.json",
             "assets/controllers/hello_controller.js",
             "assets/styles/app.css",
-            "config/packages/assets.yaml",
-            "config/packages/prod/webpack_encore.yaml",
-            "config/packages/test/webpack_encore.yaml",
             "config/packages/webpack_encore.yaml",
             "package.json",
             "webpack.config.js"
         ]
-    },
-    "symfony/yaml": {
-        "version": "v5.2.5"
-    },
-    "twig/extra-bundle": {
-        "version": "v3.3.0"
-    },
-    "twig/twig": {
-        "version": "v3.3.0"
     }
 }

app/templates/base.html.twig

@@ -3,14 +3,16 @@
     <head>
         <meta charset="UTF-8">
         <title>{% block title %}Welcome!{% endblock %}</title>
-        {# Run `composer require symfony/webpack-encore-bundle`
-           and uncomment the following Encore helpers to start using Symfony UX #}
+        <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>">
+        {# Run `composer require symfony/webpack-encore-bundle` to start using Symfony UX #}
         {% block stylesheets %}
-            {#{{ encore_entry_link_tags('app') }}#}
+            {{ encore_entry_link_tags('app') }}
+            {{ encore_entry_link_tags('vue') }}
         {% endblock %}
 
         {% block javascripts %}
-            {#{{ encore_entry_script_tags('app') }}#}
+            {{ encore_entry_script_tags('app') }}
+            {{ encore_entry_script_tags('vue') }}
         {% endblock %}
     </head>
     <body>

app/templates/vue/index.html.twig

@@ -0,0 +1,13 @@
+{% extends 'base.html.twig' %}
+
+{% block title %}{{'My VueJS template'}}{% endblock %}
+
+{% block body %}
+<div class="container">
+    <h1>{{'My VueJS template'}}</h1>
+
+    <div id="app" data-app="{{ data | json_encode() | escape('html_attr') }}"></div>
+
+
+</div>{{ dump() }}
+{% endblock %}

app/webpack.config.js

@@ -22,8 +22,11 @@ Encore
      */
     .addEntry('app', './assets/app.js')
 
+    // start VueJS application
+    .addEntry('vue', './assets/vue/index.js')
+
     // enables the Symfony UX Stimulus bridge (used in assets/bootstrap.js)
-    .enableStimulusBridge('./assets/controllers.json')
+    .enableStimulusBridge('./assets/stimulus/controllers.json')
 
     // When enabled, Webpack "splits" your files into smaller pieces for greater optimization.
     .splitEntryChunks()
@@ -45,19 +48,23 @@ Encore
     // enables hashed filenames (e.g. app.abc123.css)
     .enableVersioning(Encore.isProduction())
 
-    .configureBabel((config) => {
-        config.plugins.push('@babel/plugin-proposal-class-properties');
-    })
+    // configure Babel
+    // .configureBabel((config) => {
+    //     config.plugins.push('@babel/a-babel-plugin');
+    // })
 
-    // enables @babel/preset-env polyfills
+    // enables and configure @babel/preset-env polyfills
     .configureBabelPresetEnv((config) => {
         config.useBuiltIns = 'usage';
-        config.corejs = 3;
+        config.corejs = '3.23';
     })
 
     // enables Sass/SCSS support
     .enableSassLoader()
 
+    // enable VueJS support
+    .enableVueLoader()
+
     // uncomment if you use TypeScript
     //.enableTypeScriptLoader()
 

docker-node.sh

@@ -20,4 +20,3 @@ docker run --rm -it \
    --workdir "/app" \
    --env "YARN_CACHE_FOLDER=/app/.yarncache" \
    node:14 ${cmd}
-