Angular-cli: ng build: assets converted to utf-8 by glob-copy-webpack-plugin

[elwinarens]

Bug Report or Feature Request (mark with an x)

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

Versions.

@angular/cli: 1.0.0
node: 7.7.4
os: darwin x64
@angular/animations: 4.0.3
@angular/common: 4.0.3
@angular/compiler: 4.0.3
@angular/core: 4.0.3
@angular/forms: 4.0.3
@angular/http: 4.0.3
@angular/material: 2.0.0-beta.3
@angular/platform-browser: 4.0.3
@angular/platform-browser-dynamic: 4.0.3
@angular/router: 4.0.3
@angular/cli: 1.0.0
@angular/compiler-cli: 4.0.3

Repro steps.

1. Run ng new binarybug && cd binarybug
2. Add a binary file to the assets array in .angular-cli.json, for example a *.woff binary font.
3. Run ng build
4. Binary font is copied as utf-8, breaking the font.

The log given by the failure.

Not applicable.

Desired functionality.

Assets are copied as-is without being converted to utf-8.

Mention any other details that might be useful.

• The main issue is the use of fs.readFileSync (https://github.com/angular/angular-cli/blob/master/packages/%40angular/cli/plugins/glob-copy-webpack-plugin.ts#L50), which defaults to utf-8, and a write to file afterwards. To copy as-is a strategy using fs.open/fs.write would be required.
• ng serve correctly provides the assets in binary format.
• Might be as simple as the binary bit being dropped during the write ie. the write doesn't set the binary bit (makes sense).

[filipesilva]

Sounds like a bug alright, thanks for reporting!

[filipesilva]

Btw this issue is marked as community: help wanted - if you're available to make a fix it's most welcome.

[dave11mj]

@elwinarens is there a repo or additional details to reproduce this issue ? I was trying to tackle it since I had a fix in mind. But no matter how hard I try, I am unable break the fonts (or other binary files). So far I've tried to replicate it on both angular cli 1.0.0 and a linked repo with the latest commits, running build with / without --prod. I even tried matching the node version and the version of all the @angular packages on a new app. Below is a screenshot of my last unsuccessful attempt let me know if there is something I am missing, or that might help debug this issue. Thanks ! :D

[elwinarens]

I'm copying the binaries/fonts post ng build and haven't invested time in solving this differently.

[dave11mj]

@elwinarens when you say "copying post bg build" you mean when is set up like I did and the fonts are copied to dist by ng build the fonts stop working ?

[elwinarens]

By copying post build i mean using gulp (gulp-copy) in my case.

[dave11mj]

If its breaking in that step sounds like a gulp-copy bug then.

[elwinarens]

Facepalm: it was not gulp-copy, but rather a naive task for replacing __BUILD_VERSION__ in all files, mangling the fonts. Sorry for not investigating this more thoroughly and thanks for eventually leading to the fix.

[filipesilva]

Glad to hear this was sorted, and good job tracking down the cause 👍

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}