chg: dev: refactor legacy code on frontend - later it will be react #8

assets/js/app.js

@@ -1,12 +1,12 @@
 require('bootstrap/dist/js/bootstrap.bundle.min');
-require('owl.carousel/dist/owl.carousel.min');
+// require('owl.carousel/dist/owl.carousel.min');
 require('../js/vendor/jquery.particleground');
 
 $(function () {
     /**
      * @link https://github.com/jnicol/particleground
      */
-    particleground(document.getElementById('main-section'), {
+    $('#main-section').particleground({
         dotColor: '#aaaaaa',
         lineColor: '#bbbbbb',
         parallaxMultiplier: 15,
@@ -17,14 +17,14 @@ $(function () {
     /**
      * @link https://github.com/OwlCarousel2/OwlCarousel2
      */
-    $('.owl-carousel').owlCarousel({
-        items: 1,
-        margin: 5,
-        loop: true,
-        lazyLoad: true,
-        lazyLoadEager: 2,
-        autoplay: true,
-        autoplayTimeout: 3000,
-        autoplayHoverPause: true,
-    });
+    // $('.owl-carousel').owlCarousel({
+    //     items: 1,
+    //     margin: 5,
+    //     loop: true,
+    //     lazyLoad: true,
+    //     lazyLoadEager: 2,
+    //     autoplay: true,
+    //     autoplayTimeout: 3000,
+    //     autoplayHoverPause: true,
+    // });
 });

templates/default/index.html.twig

@@ -306,11 +306,13 @@
 {% endblock %}
 
 {% block stylesheets %}
+    {{ parent() }}
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css"
           integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
-    <link rel="stylesheet" media="screen" href="{{ asset('build/style.css') }}">
+    {{ encore_entry_link_tags('style') }}
 {% endblock %}
 
 {% block javascripts %}
-    <script type="text/javascript" language="JavaScript" src="{{ asset('build/app.js') }}"></script>
+    {{ parent() }}
+    {{ encore_entry_script_tags('app') }}
 {% endblock %}

webpack.config.js

@@ -26,6 +26,8 @@ Encore
     // .addEntry('app', './assets/js/app.js')
     //.addEntry('page1', './assets/js/page1.js')
     //.addEntry('page2', './assets/js/page2.js')
+    .addEntry('app', './assets/js/app.js')
+    .addStyleEntry('style', './assets/css/app.scss')
 
     // When enabled, Webpack "splits" your files into smaller pieces for greater optimization.
     .splitEntryChunks()
@@ -64,7 +66,7 @@ Encore
     //.enableIntegrityHashes(Encore.isProduction())
 
     // uncomment if you're having problems with a jQuery plugin
-    //.autoProvidejQuery()
+    .autoProvidejQuery()
 
     // uncomment if you use API Platform Admin (composer req api-admin)
     .enableReactPreset()