Use Laravel Mix extract + remove jQuery

package.json

@@ -3,7 +3,6 @@
   "dependencies": {
     "@babel/polyfill": "^7.2.5",
     "axios": "^0.18.0",
-    "jquery": "^3.3.1",
     "lazysizes": "^4.1.5",
     "picturefill": "^3.0.3",
     "vue": "^2.5.21"

src/js/site.js

@@ -3,5 +3,4 @@ require("lazysizes");
 require("./vendor/ls.blur-up.min.js");
 
 import './setup/axios';
-import './setup/jquery';
 import './setup/vue';

templates/_layouts/page.twig

@@ -15,11 +15,11 @@
         {% set inline_css = block("inline_css") %}
         {% if inline_css|trim is not empty %}
             <style>{{ inline_css | raw }}</style>
-            <link rel="preload" href="{{ mix('site.css') }}" as="style" onload="this.onload=null;this.rel='stylesheet'">
-            <noscript><link rel="stylesheet" href="{{ mix('site.css') }}"></noscript>
+            <link rel="preload" href="{{ mix('css/site.css') }}" as="style" onload="this.onload=null;this.rel='stylesheet'">
+            <noscript><link rel="stylesheet" href="{{ mix('css/site.css') }}"></noscript>
             <script>!function(n){"use strict";n.loadCSS||(n.loadCSS=function(){});var o=loadCSS.relpreload={};if(o.support=function(){var e;try{e=n.document.createElement("link").relList.supports("preload")}catch(t){e=!1}return function(){return e}}(),o.bindMediaToggle=function(t){var e=t.media||"all";function a(){t.media=e}t.addEventListener?t.addEventListener("load",a):t.attachEvent&&t.attachEvent("onload",a),setTimeout(function(){t.rel="stylesheet",t.media="only x"}),setTimeout(a,3e3)},o.poly=function(){if(!o.support())for(var t=n.document.getElementsByTagName("link"),e=0;e<t.length;e++){var a=t[e];"preload"!==a.rel||"style"!==a.getAttribute("as")||a.getAttribute("data-loadcss")||(a.setAttribute("data-loadcss",!0),o.bindMediaToggle(a))}},!o.support()){o.poly();var t=n.setInterval(o.poly,500);n.addEventListener?n.addEventListener("load",function(){o.poly(),n.clearInterval(t)}):n.attachEvent&&n.attachEvent("onload",function(){o.poly(),n.clearInterval(t)})}"undefined"!=typeof exports?exports.loadCSS=loadCSS:n.loadCSS=loadCSS}("undefined"!=typeof global?global:this);</script>
         {% else %}
-            <link rel="stylesheet" href="{{ mix('site.css') }}">
+            <link rel="stylesheet" href="{{ mix('css/site.css') }}">
         {% endif %}
 
         {%- minify -%}
@@ -80,7 +80,9 @@
         <![endif]-->
 
         {# -- Scripts -- #}
-        <script src="{{ mix('site.js') }}"></script>
+        <script src="{{ mix('js/manifest.js') }}"></script>
+        <script src="{{ mix('js/vendor.js') }}"></script>
+        <script src="{{ mix('js/site.js') }}"></script>
 
         {# -- Inline JS -- #}
         {% block inline_js %}

webpack.mix.js

@@ -4,8 +4,8 @@ let mix = require('laravel-mix');
 require("laravel-mix-purgecss");
 
 mix
-    .js('src/js/site.js', './web/dist')
-    .postCss('src/css/site.css', './web/dist')
+    .js('src/js/site.js', './web/dist/js')
+    .postCss('src/css/site.css', './web/dist/css')
 
     .setPublicPath('./web/dist')
 
@@ -27,22 +27,17 @@ mix
         processCssUrls: false,
     })
 
+    .sourceMaps()
+
     .version()
 
-    .babelConfig({
-        plugins: ['@babel/syntax-dynamic-import'],
-    })
+    .extract()
 
-    .webpackConfig({
-        output: {
-            // The public path needs to be set to the root of the site so
-            // Webpack can locate chunks at runtime.
-            publicPath: '/',
+    .autoload({
+    })
 
-            // We'll place all chunks in the `js` folder by default so we don't
-            // need to worry about ignoring them in our version control system.
-            chunkFilename: 'js/[name].js',
-        },
+    .babelConfig({
+        plugins: ['@babel/syntax-dynamic-import'],
     })
 
     .purgeCss({

yarn.lock

@@ -3479,11 +3479,6 @@ isobject@^3.0.0, isobject@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
 
-jquery@^3.3.1:
-  version "3.3.1"
-  resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.3.1.tgz#958ce29e81c9790f31be7792df5d4d95fc57fbca"
-  integrity sha512-Ubldcmxp5np52/ENotGxlLe6aGMvmF4R8S6tZjsP6Knsaxd/xp3Zrh50cG93lR6nPXyUFwzN3ZSOQI0wRJNdGg==
-
 js-base64@^2.1.9:
   version "2.5.0"
   resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.5.0.tgz#42255ba183ab67ce59a0dee640afdc00ab5ae93e"