Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

data uri image is broken in AOT mode using @ngtools/webpack

See original GitHub issue

Bug Report or Feature Request (mark with an `x`)

- [x ] bug report -> please search issues before submitting
- [ ] feature request

Versions.

ngtools/webpack @1.8.0 angular 5

Repro steps.

use styleUrls to include a scss file, and in this file, reference to an image like this

.logo {
  background: url('./logo.png') #fff no-repeat;
  
}

in webpack, configure url-loader for scss, and put parameter limit bigger than logo file size in order to convert logo to data uri format.

start up webpack build in AOT mode, the logo in data uri format is broken, in fact, even using file-loader, the image is broken as well.

The log given by the failure.

Desired functionality.

in angular 4, the image works normally.

Mention any other details that might be useful.

Issue Analytics

State:
Created 6 years ago
Reactions:3
Comments:11 (5 by maintainers)

Top GitHub Comments

1reaction

johanberoniuscommented, Mar 15, 2018

I had this problem too. It was solved when updating @angular/cli from 1.5.5 to 1.7.3.

1reaction

clydincommented, Jan 5, 2018

This should be corrected in 1.6.3. If this problem is still occurring, please re-open the issue.

Top Results From Across the Web

Images and fonts not loaded as encoded data uri after ...

I am updating my webpack in an angular project to webpack 5 and i am using assets/inline for images, after i publish the...

angular/angular-cli - Gitter

My href seems broken too. I found in angular.json file where I added {"baseHref":"/..."} to the configuration. But it does not seem to...

lua rrays Code Example - Code Grepper

Query the NAME field for all American cities in the CITY table with populations larger than 120000. The CountryCode for America is USA....

Pasting a dataUrl base64 encoded image in the editor fails ...

A broken image placeholder is displayed. The following error is thrown in the editor and the image is lost. com.atlassian.confluence.content.render.xhtml.

Rangle.io : Angular 2 Training - Sathyalog

Extracting translation text using the Angular CLI. How to import the completed translation files. Using the AoT Compiler. Using the JiT Compiler. Glossary....