How to use chunksSortMode in HtmlWebpackPlugin / webpack 2

Question

I have an issue with the order of my chunks inserted in index.html.

I'm using webpack2 and HtmlWebpackPlugin.

I think what is controlling the order of the chunk is the chunksSortMode option.

The documentation for HtmlWebpackPlugin is saying:

chunksSortMode: Allows to control how chunks should be sorted before they are included to the html. Allowed values: 'none' | 'auto' | 'dependency' |'manual' | {function} - default: 'auto'

What is the difference between:

none
auto
dependency
manual

For the 'function' option, this answer gave me insight

It's likely that I don't understand something basic as I would expect to find this info in the documentation from the start.

score 8 · Accepted Answer · answered Oct 09 '17 at 16:58

8

I think this file may help you, it's well commented. chunksorter

short summary:

none: performs identity mapping (no-sort).

auto: sort by chunk Id

dependency: sorts dependencies between chunks by their "parents" attribute.

manual: sort manually by the chunks:

@param {Array} chunks the chunks to sort
@return {Array} The sorted chunks

answered Oct 09 '17 at 16:58

Sarkis Arutiunian

1,281
3
17
34

1

Thanks, at least it is something! – Tonio Oct 10 '17 at 09:37
12

Although it's accepted answer, I still don't get anything from this answer at all. Yay, at least it's something. – Feb 11 '18 at 22:12
Seems like from that chunksorter code that the auto and none are exactly the same... – Luke Sep 05 '21 at 08:47

How to use chunksSortMode in HtmlWebpackPlugin / webpack 2

1 Answers1

short summary: