svg-sprite-loader: Error: Cannot find module 'svg-baker-runtime/symbol'

Do you want to request a feature, report a bug or ask a question? Ask a question

What is the current behavior? Error: Cannot find module ‘svg-baker-runtime/symbol’

I have submodule (kit for component) and main project. I tested svg-sprite-loader in kit and it was ok. Then I added this rules to main project ( https://gist.github.com/pSHCH/cb03ff5469df85439f4fe42969430330 ).

My component in kit:

import React from 'react';
import user from './img/user.svg';

var svg = {
  user
};

function Icon(props) {
  return <i>
    <svg className={st['icon-path']} viewBox={svg[props.type].viewBox}>
      <use xlinkHref={'#${svg[props.type].id}'}/>
    </svg>
  </i>;
}

export default Icon;

and use at page:

<Icon type='user'/>

What is the expected behavior?

If the current behavior is a bug, please provide the steps to reproduce, at least part of webpack config with loader configuration and piece of your code. The best way is to create repo with minimal setup to demonstrate a problem (package.json, webpack config and your code). It you don’t want to create a repository - create a gist with multiple files

If this is a feature request, what is motivation or use case for changing the behavior?

Please tell us about your environment:

Node.js version: 7.4.0
webpack version: 2.2.0
svg-sprite-loader version: 3.2.4
OS type & version: OS X El Capitan

Other information (e.g. detailed explanation, stacktraces, related issues, suggestions how to fix, links for us to have context, eg. stackoverflow, gitter, etc)

About this issue

Original URL
State: closed
Created 7 years ago
Reactions: 1
Comments: 25 (11 by maintainers)

Commits related to this issue

Reverts svg-sprite-loader due to https://github.com/kisenka/svg-sprite-loader/issues/186 — committed to Neverbland/create-react-app by woffleloffle 7 years ago
fix: pass proper context param to runtime generator BREAKING CHANGE: Possible breaks third-party runtime generators. Earlier `context` param was containing _path to compilation root context_, e.g. fo... — committed to JetBrains/svg-sprite-loader by kisenka 4 years ago

Most upvoted comments

Was facing this issue with version 4.1.6. Downgraded this to version 4.1.3 and it’s gone. Config I used:

{
        test: /\.svg$/,
        include: SVG_SPRITE_PATH_LIST,
        use: [
          {
            loader: 'svg-sprite-loader',
            options: {
              // Keeping false for now, this means that
              // SVG will be inlined with the JS. Ideally
              // it should be served separately via CDN.
              extract: false,
              // Creates sprite sheet for each type of SVG?
              spriteFilename: svgPath => `sprite-sheet${svgPath.substr(-4)}`,
            }
          },
          {
            loader: 'image-webpack-loader',
            options: {
              svgo: {
                removeComments: true,
                removeTitle: true,
                convertColors: {
                  shorthex: true
                }
              }
            }
          }
        ]
}

sunil-jhamnani-zz on May 25, 2019

@kisenka Thank you! Here’s the repo.

You can bootstrap it like this:

yarn create next-app --example https://github.com/semirart/next-with-svg-sprites
# or
npm init next-app --example https://github.com/semirart/next-with-svg-sprites

To run the project:

yarn dev
# or
npm run dev

semirart on Apr 27, 2020

I’m seeing this issue at 3.4.1 😦

thien-do on Nov 2, 2017

@kisenka I confirm, that the issue is resolved in 5.0.0. Thank you!

semirart on May 13, 2020

Fixed in svg-sprite-loader@5.0.0

kisenka on May 11, 2020