This repository showcases a Webpack issue along with incorrect handling by css-loader and extract-text-webpack-plugin.

index.js imports main.css that has a url('') rule. css-loader treats this as a module import and incorrectly rewrites '' as './'. Since there is an index.js in the directory where main.css, Webpack resolves the ./ to index.js and adds a reference to the module in the bundle:

"url(" + __webpack_require__(0) + ")"

css-loader issue

Although this might be intended, it might not be correct to require certain files such as Javascript files from CSS.

Steps to reproduce

1. yarn
2. yarn build
3. Open index.html in your browser
4. An error is thrown from index.js since it's required from main.css

extract-text-webpack-plugin issue

extract-text-webpack-plugin executes imported files during build. The contents of index.js are executed during build time and since an error is thrown from index.js, the build fails.

Steps to reproduce

1. yarn
2. yarn build:extract
3. Contents of index.js are executed. An error is thrown from index.js on build time and the build fails. Output from console.log is also displayed.

GitHub issues:

Extract Text Webpack Plugin

CSS Loader issue #1 issue #2

loader-utils