Webpack dev server refresh loop madness

Question

I've been using my own hand-rolled solution (outside of Webpack) for taking a folder of SVG files, extracting out the contents between <svg></svg>, building a JSON file, and then using that to inject into a React component so I can output specific icons with more control over the surrounding attributes.

I came across https://github.com/gilesa/svg-to-json-webpack-plugin which actually does a lot of the same for me, which is awesome! Something odd happened though when attempting to use it with create-react-app and what I suspect is the Webpack dev server. Whenever I attempt to import the generated .json file, the dev server continually refreshes in the browser.

I go into detail a bit more in the issue I created https://github.com/gilesa/svg-to-json-webpack-plugin/issues/1 but my attempts at debugging exactly what's causing the infinite loop haven't been successful. The Webpack plugin API is pretty great, so I've learned a bit along the way, but no dice thusfar.

Ideally, I'd want Webpack to ignore that specific file if that is what's causing the watcher to kick-off again. Potentially because it's creating a file in the same src directory it is looking for changes to? Thanks for any help in the right direction!

Answer 1

this sounds like a known issuse of #25, try this webpack plugin webpack-mild-compile, it should works.