[Feature] [MST] Improve webpack integration (#15) (#16)

* [Feature] [MST] Improve webpack integration

* [Feature] [MST] Add default start page

Author: Timothylul

assets/app.js

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

assets/backend.js

@@ -0,0 +1,12 @@
+/*
+ * 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/backend.css';
+
+// start the Stimulus application
+import './bootstrap';

assets/styles/backend.css

@@ -0,0 +1 @@
+@import "~bootstrap/scss/bootstrap";

assets/styles/global.scss

@@ -4,9 +4,12 @@
         "@symfony/stimulus-bridge": "^3.0.0",
         "@symfony/ux-chartjs": "file:vendor/symfony/ux-chartjs/Resources/assets",
         "@symfony/webpack-encore": "^1.7.0",
+        "bootstrap": "^5.1.3",
         "chart.js": "^3.4.1",
         "core-js": "^3.0.0",
         "regenerator-runtime": "^0.13.2",
+        "sass": "^1.49.8",
+        "sass-loader": "^12.6.0",
         "webpack-notifier": "^1.6.0"
     },
     "license": "UNLICENSED",

package-lock.json

@@ -7,6 +7,7 @@
 
 namespace App\Backend\Dashboard\Communication\Controller;
 
+use EasyCorp\Bundle\EasyAdminBundle\Config\Assets;
 use EasyCorp\Bundle\EasyAdminBundle\Config\Dashboard;
 use EasyCorp\Bundle\EasyAdminBundle\Config\MenuItem;
 use EasyCorp\Bundle\EasyAdminBundle\Controller\AbstractDashboardController;
@@ -39,4 +40,13 @@ public function configureMenuItems(): iterable
     {
         yield MenuItem::linktoDashboard('Dashboard', 'fa fa-home');
     }
+
+    /**
+     * @return Assets
+     */
+    public function configureAssets(): Assets
+    {
+        return Assets::new()
+            ->addWebpackEncoreEntry('backend');
+    }
 }

package.json

@@ -5,6 +5,5 @@
 {% block content_title %}Dashboard{% endblock %}
 
 {% block main %}
-    {{ encore_entry_link_tags('app') }}
-    {{ encore_entry_script_tags('app') }}
+    <p>Hello Backend!</p>
 {% endblock %}