Build breaks with webpack 2, postcss and svg-inline

I’m submitting a bug report

Webpack version:
2.x

Please tell us about your environment:
OSX 10.x

Current behavior:
With a specific file structure and when using postcss-loader, postcss-import and svg-inline-loader, I get the following error:

Module build failed: (SystemJS) ENOENT: no such file or directory, open '/Users/karolis/webpack-2-failing-build/loader-utils'

Expected/desired behavior:
The build should work.

To reproduce

  1. Clone https://github.com/KidkArolis/webpack-2-failing-build
  2. Run npm install && webpack --progress

I think the bug itself is caused by postcss-import, but this only happens in webpack@2, so I thought I’ll post here first and cross link to postcss-import repo. It would be nice to dive deeper and understand what’s causing this issue. It only seems to be happening with this very specific file structure. Moving the .css file around for example, might cause the build to work again. Any pointers on how to debug this further would also be appreciated.

Author: Fantashit

1 thought on “Build breaks with webpack 2, postcss and svg-inline

  1. Yep, postcss-import somehow breaks webpack’s module resolution. It may be a bug with webpack’s SystemJS support, but for now the workaround is to pin postcss-import to 8.1.0.

Comments are closed.