Skip to content

Commit 9cc99e2

Browse files
author
Angular Builds
committed
0baa9c8 feat(@angular-devkit/build-angular): improve handling of nomodules and modules in index generation
1 parent a8b30f2 commit 9cc99e2

File tree

6 files changed

+79
-82
lines changed

6 files changed

+79
-82
lines changed

‎package.json

+6-6
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
{
22
"name": "@angular-devkit/build-angular",
3-
"version": "0.800.0-beta.11+23.32a096f",
3+
"version": "0.800.0-beta.11+26.0baa9c8",
44
"description": "Angular Webpack Build Facade",
55
"experimental": true,
66
"main": "src/index.js",
77
"typings": "src/index.d.ts",
88
"builders": "builders.json",
99
"dependencies": {
10-
"@angular-devkit/architect": "github:angular/angular-devkit-architect-builds#32a096f",
11-
"@angular-devkit/build-optimizer": "github:angular/angular-devkit-build-optimizer-builds#32a096f",
12-
"@angular-devkit/build-webpack": "github:angular/angular-devkit-build-webpack-builds#32a096f",
13-
"@angular-devkit/core": "github:angular/angular-devkit-core-builds#32a096f",
14-
"@ngtools/webpack": "github:angular/ngtools-webpack-builds#32a096f",
10+
"@angular-devkit/architect": "github:angular/angular-devkit-architect-builds#0baa9c8",
11+
"@angular-devkit/build-optimizer": "github:angular/angular-devkit-build-optimizer-builds#0baa9c8",
12+
"@angular-devkit/build-webpack": "github:angular/angular-devkit-build-webpack-builds#0baa9c8",
13+
"@angular-devkit/core": "github:angular/angular-devkit-core-builds#0baa9c8",
14+
"@ngtools/webpack": "github:angular/ngtools-webpack-builds#0baa9c8",
1515
"ajv": "6.10.0",
1616
"autoprefixer": "9.5.1",
1717
"browserslist": "4.5.2",

‎src/angular-cli-files/plugins/generate-index-html.d.ts

+14-9
Original file line numberDiff line numberDiff line change
@@ -6,20 +6,25 @@
66
* found in the LICENSE file at https://angular.io/license
77
*/
88
import { Source } from 'webpack-sources';
9-
export declare type LoadOutputFileFunctionType = (file: string) => string;
10-
export interface GenerateIndexHtmlParams {
9+
export declare type LoadOutputFileFunctionType = (file: string) => Promise<string>;
10+
export interface GenerateIndexHtmlOptions {
1111
input: string;
1212
inputContent: string;
1313
baseHref?: string;
1414
deployUrl?: string;
1515
sri: boolean;
16-
unfilteredSortedFiles: CompiledFileInfo[];
17-
noModuleFiles: Set<string>;
16+
files: FileInfo[];
17+
/** Files that should be added using 'nomodule'. */
18+
noModuleFiles?: FileInfo[];
19+
/** Files that should be added using 'module'. */
20+
moduleFiles?: FileInfo[];
1821
loadOutputFile: LoadOutputFileFunctionType;
22+
/** Used to sort the inseration of files in the HTML file */
23+
entrypoints: string[];
1924
}
20-
export declare type CompiledFileType = 'nomodule' | 'module' | 'none';
21-
export interface CompiledFileInfo {
22-
file: string;
23-
type: CompiledFileType;
25+
export interface FileInfo {
26+
fileName: string;
27+
name: string;
28+
extension: string;
2429
}
25-
export declare function generateIndexHtml(params: GenerateIndexHtmlParams): Source;
30+
export declare function generateIndexHtml(params: GenerateIndexHtmlOptions): Promise<Source>;

‎src/angular-cli-files/plugins/generate-index-html.js

+32-34
Original file line numberDiff line numberDiff line change
@@ -16,32 +16,25 @@ const parse5 = require('parse5');
1616
* after processing several configurations in order to build different sets of
1717
* bundles for differential serving.
1818
*/
19-
function generateIndexHtml(params) {
20-
const loadOutputFile = params.loadOutputFile;
21-
// Filter files
22-
const existingFiles = new Set();
23-
const stylesheets = [];
24-
const scripts = [];
25-
const fileNames = params.unfilteredSortedFiles.map(f => f.file);
26-
const moduleFilesArray = params.unfilteredSortedFiles
27-
.filter(f => f.type === 'module')
28-
.map(f => f.file);
29-
const moduleFiles = new Set(moduleFilesArray);
30-
const noModuleFilesArray = params.unfilteredSortedFiles
31-
.filter(f => f.type === 'nomodule')
32-
.map(f => f.file);
33-
noModuleFilesArray.push(...params.noModuleFiles);
34-
const noModuleFiles = new Set(noModuleFilesArray);
35-
for (const file of fileNames) {
36-
if (existingFiles.has(file)) {
37-
continue;
38-
}
39-
existingFiles.add(file);
40-
if (file.endsWith('.js')) {
41-
scripts.push(file);
42-
}
43-
else if (file.endsWith('.css')) {
44-
stylesheets.push(file);
19+
async function generateIndexHtml(params) {
20+
const { loadOutputFile, files, noModuleFiles = [], moduleFiles = [], entrypoints, } = params;
21+
const stylesheets = new Set();
22+
const scripts = new Set();
23+
// Sort files in the order we want to insert them by entrypoint and dedupes duplicates
24+
const mergedFiles = [...noModuleFiles, ...moduleFiles, ...files];
25+
for (const entrypoint of entrypoints) {
26+
for (const { extension, fileName, name } of mergedFiles) {
27+
if (name !== entrypoint) {
28+
continue;
29+
}
30+
switch (extension) {
31+
case '.js':
32+
scripts.add(fileName);
33+
break;
34+
case '.css':
35+
stylesheets.add(fileName);
36+
break;
37+
}
4538
}
4639
}
4740
// Find the head and body elements
@@ -55,7 +48,7 @@ function generateIndexHtml(params) {
5548
if (htmlChild.tagName === 'head') {
5649
headElement = htmlChild;
5750
}
58-
if (htmlChild.tagName === 'body') {
51+
else if (htmlChild.tagName === 'body') {
5952
bodyElement = htmlChild;
6053
}
6154
}
@@ -90,14 +83,19 @@ function generateIndexHtml(params) {
9083
const attrs = [
9184
{ name: 'src', value: (params.deployUrl || '') + script },
9285
];
93-
if (noModuleFiles.has(script)) {
94-
attrs.push({ name: 'nomodule', value: null });
95-
}
96-
if (moduleFiles.has(script)) {
97-
attrs.push({ name: 'type', value: 'module' });
86+
// We want to include nomodule or module when a file is not common amongs all
87+
// such as runtime.js
88+
const scriptPredictor = ({ fileName }) => fileName === script;
89+
if (!files.some(scriptPredictor)) {
90+
if (noModuleFiles.some(scriptPredictor)) {
91+
attrs.push({ name: 'nomodule', value: null });
92+
}
93+
else if (moduleFiles.some(scriptPredictor)) {
94+
attrs.push({ name: 'type', value: 'module' });
95+
}
9896
}
9997
if (params.sri) {
100-
const content = loadOutputFile(script);
98+
const content = await loadOutputFile(script);
10199
attrs.push(..._generateSriAttributes(content));
102100
}
103101
const attributes = attrs
@@ -146,7 +144,7 @@ function generateIndexHtml(params) {
146144
{ name: 'href', value: (params.deployUrl || '') + stylesheet },
147145
];
148146
if (params.sri) {
149-
const content = loadOutputFile(stylesheet);
147+
const content = await loadOutputFile(stylesheet);
150148
attrs.push(..._generateSriAttributes(content));
151149
}
152150
const element = treeAdapter.createElement('link', undefined, attrs);

‎src/angular-cli-files/plugins/index-html-webpack-plugin.d.ts

-7
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,3 @@
1-
/**
2-
* @license
3-
* Copyright Google Inc. All Rights Reserved.
4-
*
5-
* Use of this source code is governed by an MIT-style license that can be
6-
* found in the LICENSE file at https://angular.io/license
7-
*/
81
import { Compiler } from 'webpack';
92
export interface IndexHtmlWebpackPluginOptions {
103
input: string;

‎src/angular-cli-files/plugins/index-html-webpack-plugin.js

+26-25
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,13 @@
11
"use strict";
22
Object.defineProperty(exports, "__esModule", { value: true });
3+
/**
4+
* @license
5+
* Copyright Google Inc. All Rights Reserved.
6+
*
7+
* Use of this source code is governed by an MIT-style license that can be
8+
* found in the LICENSE file at https://angular.io/license
9+
*/
10+
const path = require("path");
311
const generate_index_html_1 = require("./generate-index-html");
412
function readFile(filename, compilation) {
513
return new Promise((resolve, reject) => {
@@ -34,41 +42,34 @@ class IndexHtmlWebpackPlugin {
3442
const inputContent = await readFile(this._options.input, compilation);
3543
compilation
3644
.fileDependencies.add(this._options.input);
37-
const loadOutputFile = (name) => compilation.assets[name].source();
3845
// Get all files for selected entrypoints
39-
const unfilteredSortedFiles = [];
40-
const noModuleFiles = new Set();
41-
const otherFiles = new Set();
42-
for (const entryName of this._options.entrypoints) {
43-
const entrypoint = compilation.entrypoints.get(entryName);
44-
if (entrypoint && entrypoint.getFiles) {
45-
const files = entrypoint.getFiles() || [];
46-
unfilteredSortedFiles.push(...files);
47-
if (this._options.noModuleEntrypoints.includes(entryName)) {
48-
files.forEach(file => noModuleFiles.add(file));
49-
}
50-
else {
51-
files.forEach(file => otherFiles.add(file));
52-
}
46+
const files = [];
47+
const noModuleFiles = [];
48+
for (const [entryName, entrypoint] of compilation.entrypoints) {
49+
const entryFiles = (entrypoint && entrypoint.getFiles() || [])
50+
.map((f) => ({
51+
name: entryName,
52+
fileName: f,
53+
extension: path.extname(f),
54+
}));
55+
if (this._options.noModuleEntrypoints.includes(entryName)) {
56+
noModuleFiles.push(...entryFiles);
57+
}
58+
else {
59+
files.push(...entryFiles);
5360
}
5461
}
55-
// Clean out files that are used in all types of entrypoints
56-
otherFiles.forEach(file => noModuleFiles.delete(file));
57-
// If this plugin calls generateIndexHtml it always uses type: 'none' to align with
58-
// its original behavior.
59-
const compiledFiles = unfilteredSortedFiles.map(f => ({
60-
file: f,
61-
type: 'none',
62-
}));
63-
const indexSource = generate_index_html_1.generateIndexHtml({
62+
const loadOutputFile = (name) => compilation.assets[name].source();
63+
const indexSource = await generate_index_html_1.generateIndexHtml({
6464
input: this._options.input,
6565
inputContent,
6666
baseHref: this._options.baseHref,
6767
deployUrl: this._options.deployUrl,
6868
sri: this._options.sri,
69-
unfilteredSortedFiles: compiledFiles,
69+
files,
7070
noModuleFiles,
7171
loadOutputFile,
72+
entrypoints: this._options.entrypoints,
7273
});
7374
// Add to compilation assets
7475
compilation.assets[this._options.output] = indexSource;

‎uniqueId

+1-1
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
Tue Apr 09 2019 16:46:00 GMT+0000 (Coordinated Universal Time)
1+
Wed Apr 10 2019 16:02:36 GMT+0000 (Coordinated Universal Time)

0 commit comments

Comments
 (0)