Skip to content

Commit 22fb03f

Browse files
committedJun 3, 2018
fix(chunksorter): Don't sort chunks by default
BREAKING CHANGE: Chunks aren't sorted anymore by default
1 parent a0a0f0d commit 22fb03f

File tree

2 files changed

+1
-165
lines changed

2 files changed

+1
-165
lines changed
 

‎lib/chunksorter.js

+1-104
Original file line numberDiff line numberDiff line change
@@ -1,101 +1,5 @@
11
'use strict';
22

3-
const toposort = require('toposort');
4-
const _ = require('lodash');
5-
6-
/**
7-
Sorts dependencies between chunks by their "parents" attribute.
8-
9-
This function sorts chunks based on their dependencies with each other.
10-
The parent relation between chunks as generated by Webpack for each chunk
11-
is used to define a directed (and hopefully acyclic) graph, which is then
12-
topologically sorted in order to retrieve the correct order in which
13-
chunks need to be embedded into HTML. A directed edge in this graph is
14-
describing a "is parent of" relationship from a chunk to another (distinct)
15-
chunk. Thus topological sorting orders chunks from bottom-layer chunks to
16-
highest level chunks that use the lower-level chunks.
17-
18-
@param {Array} chunks an array of chunks as generated by the html-webpack-plugin.
19-
- For webpack < 4, It is assumed that each entry contains at least the properties
20-
"id" (containing the chunk id) and "parents" (array containing the ids of the
21-
parent chunks).
22-
- For webpack 4+ the see the chunkGroups param for parent-child relationships
23-
24-
@param {Array} chunks an array of ChunkGroups that has a getParents method.
25-
Each ChunkGroup contains a list of chunks in order.
26-
27-
@return {Array} A topologically sorted version of the input chunks
28-
*/
29-
module.exports.dependency = (chunks, options, compilation) => {
30-
const chunkGroups = compilation.chunkGroups;
31-
if (!chunks) {
32-
return chunks;
33-
}
34-
35-
// We build a map (chunk-id -> chunk) for faster access during graph building.
36-
const nodeMap = {};
37-
38-
chunks.forEach(chunk => {
39-
nodeMap[chunk.id] = chunk;
40-
});
41-
42-
// Next, we add an edge for each parent relationship into the graph
43-
let edges = [];
44-
45-
if (chunkGroups) {
46-
// Add an edge for each parent (parent -> child)
47-
edges = chunkGroups.reduce((result, chunkGroup) => result.concat(
48-
Array.from(chunkGroup.parentsIterable, parentGroup => [parentGroup, chunkGroup])
49-
), []);
50-
const sortedGroups = toposort.array(chunkGroups, edges);
51-
// flatten chunkGroup into chunks
52-
const sortedChunks = sortedGroups
53-
.reduce((result, chunkGroup) => result.concat(chunkGroup.chunks), [])
54-
.map(chunk => // use the chunk from the list passed in, since it may be a filtered list
55-
nodeMap[chunk.id])
56-
.filter((chunk, index, self) => {
57-
// make sure exists (ie excluded chunks not in nodeMap)
58-
const exists = !!chunk;
59-
// make sure we have a unique list
60-
const unique = self.indexOf(chunk) === index;
61-
return exists && unique;
62-
});
63-
return sortedChunks;
64-
} else {
65-
// before webpack 4 there was no chunkGroups
66-
chunks.forEach(chunk => {
67-
if (chunk.parents) {
68-
// Add an edge for each parent (parent -> child)
69-
chunk.parents.forEach(parentId => {
70-
// webpack2 chunk.parents are chunks instead of string id(s)
71-
const parentChunk = _.isObject(parentId) ? parentId : nodeMap[parentId];
72-
// If the parent chunk does not exist (e.g. because of an excluded chunk)
73-
// we ignore that parent
74-
if (parentChunk) {
75-
edges.push([parentChunk, chunk]);
76-
}
77-
});
78-
}
79-
});
80-
// We now perform a topological sorting on the input chunks and built edges
81-
return toposort.array(chunks, edges);
82-
}
83-
};
84-
85-
/**
86-
* Sorts the chunks based on the chunk id.
87-
*
88-
* @param {Array} chunks the list of chunks to sort
89-
* @return {Array} The sorted list of chunks
90-
*/
91-
module.exports.id = chunks => chunks.sort(function orderEntryLast (a, b) {
92-
if (a.entry !== b.entry) {
93-
return b.entry ? 1 : -1;
94-
} else {
95-
return b.id - a.id;
96-
}
97-
});
98-
993
/**
1004
* Performs identity mapping (no-sort).
1015
* @param {Array} chunks the chunks to sort
@@ -129,11 +33,4 @@ module.exports.manual = (chunks, options) => {
12933
/**
13034
* Defines the default sorter.
13135
*/
132-
module.exports.auto = module.exports.id;
133-
134-
// In webpack 2 the ids have been flipped.
135-
// Therefore the id sort doesn't work the same way as it did for webpack 1
136-
// Luckily the dependency sort is working as expected
137-
if (Number(require('webpack/package.json').version.split('.')[0]) > 1) {
138-
module.exports.auto = module.exports.dependency;
139-
}
36+
module.exports.auto = module.exports.none;

‎spec/BasicSpec.js

-61
Original file line numberDiff line numberDiff line change
@@ -1546,67 +1546,6 @@ describe('HtmlWebpackPlugin', function () {
15461546
}, [/<script type="text\/javascript" src="c_bundle.js">.+<script type="text\/javascript" src="b_bundle.js">.+<script type="text\/javascript" src="a_bundle.js">/], null, done);
15471547
});
15481548

1549-
it('should sort the chunks by chunk dependencies', function (done) {
1550-
testHtmlPlugin({
1551-
entry: {
1552-
util: path.join(__dirname, 'fixtures/util.js'),
1553-
aTheme: path.join(__dirname, 'fixtures/theme.js')
1554-
},
1555-
output: {
1556-
path: OUTPUT_DIR,
1557-
filename: '[name]_bundle.js'
1558-
},
1559-
module: {
1560-
loaders: [
1561-
{ test: /\.css$/, loader: 'css-loader' }
1562-
]
1563-
},
1564-
__commonsChunk: {
1565-
name: 'common',
1566-
filename: 'common_bundle.js'
1567-
},
1568-
plugins: [
1569-
new HtmlWebpackPlugin({
1570-
chunksSortMode: 'dependency'
1571-
})
1572-
]
1573-
}, [
1574-
// theme and util don't depend on each other, so the order of those doesn't matter
1575-
/<script type="text\/javascript" src="common_bundle.js">.+(<script type="text\/javascript" src="aTheme_bundle.js">.+<script type="text\/javascript" src="util_bundle.js">|<script type="text\/javascript" src="util_bundle.js">.+<script type="text\/javascript" src="aTheme_bundle.js">)/
1576-
], null, done);
1577-
});
1578-
1579-
it('should sort the chunks by chunk dependencies even if a parent chunk is excluded', function (done) {
1580-
testHtmlPlugin({
1581-
entry: {
1582-
util: path.join(__dirname, 'fixtures/util.js'),
1583-
aTheme: path.join(__dirname, 'fixtures/theme.js')
1584-
},
1585-
output: {
1586-
path: OUTPUT_DIR,
1587-
filename: '[name]_bundle.js'
1588-
},
1589-
module: {
1590-
loaders: [
1591-
{ test: /\.css$/, loader: 'css-loader' }
1592-
]
1593-
},
1594-
__commonsChunk: {
1595-
name: 'common',
1596-
filename: 'common_bundle.js'
1597-
},
1598-
plugins: [
1599-
new HtmlWebpackPlugin({
1600-
chunksSortMode: 'dependency',
1601-
excludeChunks: ['common']
1602-
})
1603-
]
1604-
}, [
1605-
// theme and util don't depend on each other, so the order of those doesn't matter
1606-
/(<script type="text\/javascript" src="aTheme_bundle.js">.+<script type="text\/javascript" src="util_bundle.js">|<script type="text\/javascript" src="util_bundle.js">.+<script type="text\/javascript" src="aTheme_bundle.js">)/
1607-
], null, done);
1608-
});
1609-
16101549
it('should sort manually by the chunks', function (done) {
16111550
testHtmlPlugin({
16121551
entry: {

0 commit comments

Comments
 (0)
Please sign in to comment.