Skip to content

Instantly share code, notes, and snippets.

@sagalbot
Last active November 5, 2021 17:37
Show Gist options
  • Save sagalbot/5e96701e0cf9ed7bfc7609bc92c93893 to your computer and use it in GitHub Desktop.
Save sagalbot/5e96701e0cf9ed7bfc7609bc92c93893 to your computer and use it in GitHub Desktop.
Using vue-svg-loader@beta with laravel-mix v6.
module.exports = {
output: {
assetModuleFilename: "img/[hash][ext][query]",
},
module: {
rules: [
{
test: /\.svg$/,
use: ["vue-loader", "vue-svg-loader"],
},
{
test: /\.(png|jpg|webp|jpeg|gif)$/i,
type: "asset/resource",
},
],
},
};
const mix = require("laravel-mix");
mix
.js("resources/js/app.js", "public/js")
.vue()
.options({
// Mix lumps svgs in with images so that they're processed with
// file-loader and image-loader. We can disable mix from handling
// images at all by setting the flag below, and instead use
// asset management in Webpack 5.
// @see https://webpack.js.org/guides/asset-management/#loading-images
imgLoaderOptions: false,
})
.webpackConfig(require("./webpack.config"));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment