Commits on Oct 14, 2020

1. feat(@angular-devkit/build-angular): add font inliner …

   This is the base functionality needed to inline Google fonts and Icons in HTML.
   
   The processor does a couple of things:
   1. When support for older devices is needed where woff2 is not supported it will inline definitions for both woff1 and woff2
   2. Will remove comments and whitespaces when it's `minifyInlinedCSS` is enabled.
   3. Cache responses so to resuse the font response during watch mode.
   
   Note: this is still an internal implementation which users cannot leverage just yet.

   

   alan-agius4 committed Oct 14, 2020
   Copy the full SHA

   78acf11 View commit details

   Browse the repository at this point in the history

2. build: add @types/cacache

   

   alan-agius4 committed Oct 14, 2020
   Copy the full SHA

   b300139 View commit details

   Browse the repository at this point in the history

3. refactor(@angular-devkit/build-angular): add disk cache to font inliner

   

   alan-agius4 committed Oct 14, 2020
   Copy the full SHA

   a9c1f2b View commit details

   Browse the repository at this point in the history

4. feat(@angular-devkit/build-angular): enable font inlining optimizations …

   With this change we inline Google fonts and icons in the index html file when optimization is enabled.
   
   **Before**
   ```html
   <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
   ```
   **After**
   ```html
   <style>
     @font-face {
       font-family: 'Material Icons';
       font-style: normal;
       font-weight: 400;
       src: url(https://fonts.gstatic.com/s/materialicons/v55/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2) format('woff2');
     }
   
     .material-icons {
       font-family: 'Material Icons';
       font-weight: normal;
       font-style: normal;
       font-size: 24px;
       line-height: 1;
       letter-spacing: normal;
       text-transform: none;
       display: inline-block;
       white-space: nowrap;
       word-wrap: normal;
       direction: ltr;
     }
   </style>
   ```
   
   To opt-out of this feature set `optimization.fonts: false` or `optimization.fonts.inline: false` in the browser builder options.
   
   Example:
   ```js
   "configurations": {
     "production": {
       "fileReplacements": [
         {
           "replace": "src/environments/environment.ts",
           "with": "src/environments/environment.prod.ts"
         }
       ],
       "optimization": {
         "fonts": false
       },
   ```
   
   More information about the motivation for this feature can be found: #18730
   
   Note: internet access is required during the build for this optimization to work.

   

   alan-agius4 committed Oct 14, 2020
   Copy the full SHA

   ac41f28 View commit details

   Browse the repository at this point in the history