Promote asset/resource rather than url-loader

Author: skuadron45

build/webpack.config.js

@@ -21,7 +21,6 @@ module.exports = env => {
 
   return {
     target: 'web',
-
     context: path.join(__dirname, '../src'),
     entry: {
       app: path.join(__dirname, '../src/app.js'),
@@ -92,28 +91,25 @@ module.exports = env => {
         },
         {
           test: /\.(png|jpe?g|gif|svg|ico)(\?.*)?$/,
-          loader: 'url-loader',
-          options: {
-            limit: 3000,
-            name: 'assets/images/[name].[contenthash:7].[ext]'
+          type: 'asset/resource',
+          generator: {
+            filename: 'assets/images/[name].[contenthash:7][ext]'
           }
         },
         {
           test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
-          loader: 'url-loader',
-          options: {
-            limit: 5000,
-            name: 'assets/fonts/[name].[contenthash:7].[ext]'
+          type: 'asset/resource',
+          generator: {
+            filename: 'assets/fonts/[name].[contenthash:7][ext]'
           }
         },
-        /* {
+        /*{
           test: /\.(mp4)(\?.*)?$/,
-          loader: 'url-loader',
-          options: {
-            limit: 10000,
-            name: 'assets/videos/[name].[contenthash:7].[ext]'
-          }
-        } */
+          type: 'asset/resource',
+          generator: {
+            filename: 'assets/videos/[name].[contenthash:7][ext]'
+          },
+        }*/
       ]
     },
     experiments: {

src/views/layouts/master.pug

@@ -35,16 +35,16 @@ html(lang='en')
 
 
     //- Favicons
-    link(rel='apple-touch-icon', sizes='180x180', href=require('images/favicons/apple-touch-icon.png').default)
-    link(rel='icon', type='image/png', sizes='32x32', href=require('images/favicons/favicon-32x32.png').default)
-    link(rel='icon', type='image/png', sizes='16x16', href=require('images/favicons/favicon-16x16.png').default)
-    link(rel='shortcut icon', href=require('images/favicons/favicon.ico').default)
+    link(rel='apple-touch-icon', sizes='180x180', href=require('images/favicons/apple-touch-icon.png'))
+    link(rel='icon', type='image/png', sizes='32x32', href=require('images/favicons/favicon-32x32.png'))
+    link(rel='icon', type='image/png', sizes='16x16', href=require('images/favicons/favicon-16x16.png'))
+    link(rel='shortcut icon', href=require('images/favicons/favicon.ico'))
 
     //- Preload fonts
-    link(type='font/woff', href=require('source/assets/fonts/Quicksand-Bold.woff').default, rel='preload', as='font', crossorigin)
-    link(type='font/woff', href=require('source/assets/fonts/Quicksand-Medium.woff').default, rel='preload', as='font', crossorigin)
-    link(type='font/woff', href=require('source/assets/fonts/Quicksand-Regular.woff').default, rel='preload', as='font', crossorigin)
-    link(type='font/woff', href=require('source/assets/fonts/Quicksand-Light.woff').default, rel='preload', as='font', crossorigin)
+    link(type='font/woff', href=require('source/assets/fonts/Quicksand-Bold.woff'), rel='preload', as='font', crossorigin)
+    link(type='font/woff', href=require('source/assets/fonts/Quicksand-Medium.woff'), rel='preload', as='font', crossorigin)
+    link(type='font/woff', href=require('source/assets/fonts/Quicksand-Regular.woff'), rel='preload', as='font', crossorigin)
+    link(type='font/woff', href=require('source/assets/fonts/Quicksand-Light.woff'), rel='preload', as='font', crossorigin)
 
     //- Title
     block title