mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
build: minify html before inlining resources (#4877)
* build: minify html before inlining resources * Now minifies the HTML files before inlining the resources. This drops unnecessary whitespace due to previous line breaks and developers can easily test with Material components. Fixes #1596 * Address comment
This commit is contained in:
committed by
mmalerba
parent
3f08e37d13
commit
508b14198d
@@ -1,13 +1,14 @@
|
||||
import {task, watch} from 'gulp';
|
||||
import {task, watch, src, dest} from 'gulp';
|
||||
import {join} from 'path';
|
||||
import {main as tsc} from '@angular/tsc-wrapped';
|
||||
import {SOURCE_ROOT, DIST_ROOT} from '../build-config';
|
||||
import {SOURCE_ROOT, DIST_ROOT, HTML_MINIFIER_OPTIONS} from '../build-config';
|
||||
import {sequenceTask, sassBuildTask, copyTask, triggerLivereload} from '../util/task_helpers';
|
||||
import {composeRelease} from './build-release';
|
||||
import {buildPackageBundles} from './build-bundles';
|
||||
|
||||
// There are no type definitions available for these imports.
|
||||
const inlineResources = require('../../../scripts/release/inline-resources');
|
||||
const htmlmin = require('gulp-htmlmin');
|
||||
|
||||
/**
|
||||
* Creates a set of gulp tasks that can build the specified package.
|
||||
@@ -25,8 +26,11 @@ export function createPackageBuildTasks(packageName: string, requiredPackages: s
|
||||
// Paths to the different output files and directories.
|
||||
const esmMainFile = join(packageOut, 'index.js');
|
||||
|
||||
// Glob that matches all assets that should be copied to the package.
|
||||
const assetsGlob = join(packageRoot, '**/*.+(html|scss|css)');
|
||||
// Glob that matches all style files that need to be copied to the package output.
|
||||
const stylesGlob = join(packageRoot, '**/*.+(scss|css)');
|
||||
|
||||
// Glob that matches every HTML file in the current package.
|
||||
const htmlGlob = join(packageRoot, '**/*.html');
|
||||
|
||||
/**
|
||||
* Main tasks for the package building. Tasks execute the different sub-tasks in the correct
|
||||
@@ -70,10 +74,16 @@ export function createPackageBuildTasks(packageName: string, requiredPackages: s
|
||||
/**
|
||||
* Asset tasks. Building SASS files and inlining CSS, HTML files into the ESM output.
|
||||
*/
|
||||
task(`${packageName}:assets`, [`${packageName}:assets:scss`, `${packageName}:assets:html`]);
|
||||
task(`${packageName}:assets`, [
|
||||
`${packageName}:assets:scss`, `${packageName}:assets:copy-styles`, `${packageName}:assets:html`
|
||||
]);
|
||||
|
||||
task(`${packageName}:assets:scss`, sassBuildTask(packageOut, packageRoot, true));
|
||||
task(`${packageName}:assets:html`, copyTask(assetsGlob, packageOut));
|
||||
task(`${packageName}:assets:copy-styles`, copyTask(stylesGlob, packageOut));
|
||||
task(`${packageName}:assets:html`, () => {
|
||||
return src(htmlGlob).pipe(htmlmin(HTML_MINIFIER_OPTIONS)).pipe(dest(packageOut));
|
||||
});
|
||||
|
||||
task(`${packageName}:assets:inline`, () => inlineResources(packageOut));
|
||||
|
||||
/**
|
||||
|
||||
Reference in New Issue
Block a user