Svg-sprite-loader is used in laravel-mix to deal with SVG icons. How to modify the original default configuration in mix?

Overview

I want to use the svg-sprite-loader package to handle the SVG icon, referring to vue-element-admin/./index.js on Github.

question

I follow the teacher"s tutorial Portal to configure webpack.

.

clipboard.png

but found that looking at the default module rules configuration of Laravel-mix (path: node_modules/laravel-mix/src/builder/webpack-rules.js), Line:11-73 has:

rules.push({
    // only include svg that doesn"t have font in the path or file name by using negative lookahead
    test: /(\.(png|jpe?g|gif)$|^((?!font).)*\.svg$)/,
    loaders: [
         {
             loader: "file-loader",
             ......
         }
    ]
});
// Add support for loading fonts.
rules.push({
    test: /(\.(woff2?|ttf|eot|otf)$|font.*\.svg$)/,
    loader: "file-loader",
    .....
});

ask for advice

  1. is there a way to modify only the module.rules based on the original webpack configuration of Laravel-mix?
  2. or create a new webpack config? that is compatible with the original code without the configuration of laravel-mix
Mar.21,2021

I also encountered the same problem as the landlord, which has now been solved. Just add the following configuration to webpack.mix.js :


webpackConfig:

mix.webpackConfig({
    module: {
        rules: [
            {
                test: /\.(woff2?|ttf|eot|svg|otf)$/,
                loader: 'file-loader',
                options: {
                    name: '../fonts/[name].[ext]?[hash]',
                    publicPath: '../foo/bar' // 
                }
            }
        ]
    }
});

Don't forget to remove -- config=node_modules/laravel-mix/setup/webpack.config.js

from package.json .
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-7b9179-1315c.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-7b9179-1315c.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?