vue-svg-loader@0.17.0-beta.2 contains 115 MiB of vue-cli

[simon04]

The npm package vue-svg-loader@0.17.0-beta.2 contains 115 MiB of vue-cli – https://unpkg.com/browse/vue-svg-loader@0.17.0-beta.2/

Please re-package in a clean environment.

[Raademar]

Is this being looked into?

[simon04]

I gave up waiting and replaced vue-svg-loader with a minimalistic loader stored in the project itself:

// vue-svg-loader.js
module.exports = function VueSvgLoader(svg) {
  this.cacheable();
  return `<template>${svg}</template>`;
};

// vue.config.js
module.exports = {
  chainWebpack: (config) => {
    config.module.rule("svg").uses.clear();
    config.module
      .rule("svg")
      .use("vue-loader")
      .loader("vue-loader")
      .end()
      .use("./vue-svg-loader")
      .loader("./vue-svg-loader");
  },
};

[Raademar]

This solution worked fine for me

[pmrotule]

I gave up waiting and replaced vue-svg-loader with a minimalistic loader stored in the project itself:

// vue-svg-loader.js
module.exports = function VueSvgLoader(svg) {
  this.cacheable();
  return `<template>${svg}</template>`;
};

// vue.config.js
module.exports = {
  chainWebpack: (config) => {
    config.module.rule("svg").uses.clear();
    config.module
      .rule("svg")
      .use("vue-loader")
      .loader("vue-loader")
      .end()
      .use("./vue-svg-loader")
      .loader("./vue-svg-loader");
  },
};

@simon04 You don't seem to optimize your svg code with svgo like vue-svg-loader would do.

[simon04]

@pmrotule, you're right. My use-case was to load bootstrap-icons. Thus, using svgo seemed unnecessary.

[vpillinger]

Here is code with svgo 2.2.

// vue-svg-loader.js
const { optimize } = require('svgo');

module.exports = async function (svg) {
    this.cacheable();

    const svgo = new SVGO(svgoConfig);

    ({ data: svg } = await svgo.optimize(svg, {
        path: this.resourcePath,
    }));

    return `<template>${svg}</template>`;
};

[jzymx50]

As an alternative, if you only use vue2, you can switch to version 0.17-beta.0.

[rdhainaut]

Here is code with svgo 2.2.

// vue-svg-loader.js
const { optimize } = require('svgo');

module.exports = async function (svg) {
  this.cacheable();

  const svgo = new SVGO(svgoConfig);

  ({ data: svg } = await svgo.optimize(svg, {
      path: this.resourcePath,
  }));

  return `<template>${svg}</template>`;
};

Unfortunately it seems doesn't work with svgo 3 :(