webpack-blocks icon indicating copy to clipboard operation
webpack-blocks copied to clipboard

Using assets package with webpack 4 and babel7

Open kure- opened this issue 7 years ago • 1 comments

Hey, this is probably not a real issue, but I would like to share this case if anyone struggles with the same problem. I'm using webpack 4.9.1 in my project with latest babel7 and I've run into an issue with Assets package while using file() in combination with match() when using 1.0.0 of webpack blocks. The package uses probably outdated version of file-loader dependency (0.11.2). Forcing resolutions in my package.json to use latest version of file-loader (1.11.1) removed an issue Cannot read property 'fileLoader' of undefined with setup like that:

const { createConfig, match } = require('@webpack-blocks/webpack');
const { css, url, file } = require('@webpack-blocks/assets');
const babel = require('@webpack-blocks/babel');
....
....
createConfig([
		babel(),
		match(['*.css'], [
			css()
		]),
		match(['*.svg'], [
			file()
		]),
	])
...

The case is, that you load a CSS file, which contains classes that have property e.g. background-image:url(../icons/checkmark.svg. Without the match() and file() it cant handle such files as the webpack tries to handle the source of the svg itself.

kure- avatar May 29 '18 14:05 kure-

Ohh, that issue is still unanswered. Sorry for that!

Try the v2.0.0-alpha with webpack 4 support 😉

Install using npm install --save-dev webpack-blocks@next.

andywer avatar Jun 30 '18 11:06 andywer