Webpack bootloader displays empty png images

I encounter a very strange problem when I try to use a file loader.

var sunTextureUrl = require("file?name=picture.png!../textures/flare.png"); console.log(sunTextureUrl); 

My config is as follows

  output: { path: path.resolve(__dirname, 'assets'), publicPath: "/assets/", filename: "[name].js" }, module: { loaders: [ {test: /\.(gif|png|jpe?g|svg)$/i, loader: 'file'}, {test: /\.glsl$/, loader: 'webpack-glsl'}, {test: /\.js$/, exclude: /node_modules/, loader: "babel-loader", query: { presets: ['es2015'] }} ] }, plugins: [ new webpack.optimize.CommonsChunkPlugin({name: 'vendors', filename: "vendors.js"}), new webpack.optimize.UglifyJsPlugin(minifiedOpt), new webpack.DefinePlugin({ 'process.env': { 'NODE_ENV': JSON.stringify(opt.production ? 'production' : 'development') } }), new webpack.ProvidePlugin({ THREE: 'three' }) ] 

I get the following output:

  Asset Size Chunks Chunk Names c8510617bc54cb2c5b707a4dfdb98337.png 13.2 kB [emitted] picture.png 82 bytes [emitted] main.js 12.5 kB 0 [emitted] main vendors.js 491 kB 1 [emitted] vendors 

In browser, console.log gives me

 /assets/picture.png 

So basically webpack parses one image into two. And the one that has the hash as a name is the image I want, and picture.png is an empty image. Very strange.

+5
source share

Source: https://habr.com/ru/post/1259385/


All Articles