nav tabs on admin dashboard

node_modules/laravel-mix/src/config.js

@@ -1,6 +1,3 @@
-let paths = new (require('./Paths'))();
-let webpackMerge = require('webpack-merge');
-
 module.exports = function() {
     return {
         /**
@@ -12,13 +9,6 @@ module.exports = function() {
             process.env.NODE_ENV === 'production' ||
             process.argv.includes('-p'),
 
-        /**
-         * A list of custom assets that are being compiled outside of Webpack.
-         *
-         * @type {Array}
-         */
-        customAssets: [],
-
         /**
          * Determine if we should enable hot reloading.
          *
@@ -96,17 +86,6 @@ module.exports = function() {
          */
         resourceRoot: '/',
 
-        /**
-         * vue-loader specific options.
-         *
-         * @type {Object}
-         */
-        vue: {
-            preLoaders: {},
-            postLoaders: {},
-            esModule: false
-        },
-
         /**
          * Image Loader defaults.
          * See: https://github.com/thetalecrafter/img-loader#options
@@ -134,68 +113,38 @@ module.exports = function() {
         /**
          * The default Babel configuration.
          *
-         * @type {Object}
+         * @type {String} babelRcPath
          */
-        babel: function() {
-            let options = {};
+        babel: function(babelRcPath) {
+            babelRcPath = babelRcPath || Mix.paths.root('.babelrc');
 
-            tap(Mix.paths.root('.babelrc'), babelrc => {
-                if (File.exists(babelrc)) {
-                    options = JSON.parse(File.find(babelrc).read());
-                }
-            });
-
-            if (this.babelConfig) {
-                options = webpackMerge.smart(options, this.babelConfig);
-            }
-
-            return webpackMerge.smart(
-                {
-                    cacheDirectory: true,
-                    presets: [
-                        [
-                            'env',
-                            {
-                                modules: false,
-                                targets: {
-                                    browsers: ['> 2%'],
-                                    uglify: true
-                                }
-                            }
-                        ]
-                    ],
-                    plugins: [
-                        'transform-object-rest-spread',
-                        [
-                            'transform-runtime',
-                            {
-                                polyfill: false,
-                                helpers: false
-                            }
-                        ]
-                    ]
-                },
-                options
+            return require('./BabelConfig').generate(
+                this.babelConfig,
+                babelRcPath
             );
         },
 
         /**
-         * Determine if CSS url()s should be processed by Webpack.
+         * Determine if CSS relative url()s should be calculated by Sass Webpack,
+         * using resolve-url-loader. Disabling this can improve performance
+         * greatly.
          *
          * @type {Boolean}
          */
         processCssUrls: true,
 
         /**
-         * Whether to extract .vue component styles into a dedicated file.
+         * Should we extract .vue component styles into a dedicated file?
          * You may provide a boolean, or a dedicated path to extract to.
          *
+         * Ex: extractVueStyles: '/css/vue.css'
+         *
          * @type {Boolean|string}
          */
         extractVueStyles: false,
 
         /**
-         * File with global styles to be imported in every component.
+         * A file path with global styles that shuold be imported into every Vue component.
          *
          * See: https://vue-loader.vuejs.org/en/configurations/pre-processors.html#loading-a-global-settings-file
          *
@@ -204,15 +153,17 @@ module.exports = function() {
         globalVueStyles: '',
 
         /**
-         * Uglify-specific settings for Webpack.
+         * Terser-specific settings for Webpack.
          *
-         * See: https://github.com/mishoo/UglifyJS2#compressor-options
+         * See: https://github.com/webpack-contrib/terser-webpack-plugin#options
          *
          * @type {Object}
          */
-        uglify: {
+        terser: {
+            cache: true,
+            parallel: true,
             sourceMap: true,
-            uglifyOptions: {
+            terserOptions: {
                 compress: {
                     warnings: false
                 },
@@ -222,6 +173,15 @@ module.exports = function() {
             }
         },
 
+        /**
+         * cssnano-specific settings for Webpack.
+         *
+         * See: https://cssnano.co/optimisations/
+         *
+         * @type {Object}
+         */
+        cssNano: {},
+
         /**
          * CleanCss-specific settings for Webpack.
          *