@@ -6,68 +6,76 @@ sort: 3
6
6
7
7
The Compilation instance extends from the compiler i.e. ` compiler.compilation ` . It is the literal compilation of all the objects in the require graph. This object has access to all the modules and their dependencies (most of which are circular references). In the compilation phase, modules are loaded, sealed, optimized, chunked, hashed and restored, etc. This would be the main lifecycle of any operations of the compilation.
8
8
9
- ``` javascript
9
+ ``` js
10
10
compiler .plugin (" compilation" , function (compilation ) {
11
- // the main compilation instance
12
- // all subsequent methods are derived from compilation.plugin
11
+ // the main compilation instance
12
+ // all subsequent methods are derived from compilation.plugin
13
13
});
14
14
```
15
15
16
+
16
17
## ` normal-module-loader `
17
18
18
19
The normal module loader, is the function that actually loads all the modules in the module graph (one-by-one).
19
20
20
- ``` javascript
21
+ ``` js
21
22
compilation .plugin (' normal-module-loader' , function (loaderContext , module ) {
22
- // this is where all the modules are loaded
23
- // one by one, no dependencies are created yet
23
+ // this is where all the modules are loaded
24
+ // one by one, no dependencies are created yet
24
25
});
25
26
```
26
27
28
+
27
29
## ` seal `
28
30
29
31
The sealing of the compilation has started.
30
32
31
- ``` javascript
33
+ ``` js
32
34
compilation .plugin (' seal' , function () {
33
- // you are not accepting any more modules
34
- // no arguments
35
+ // you are not accepting any more modules
36
+ // no arguments
35
37
});
36
38
```
37
39
40
+
38
41
## ` optimize `
39
42
40
43
Optimize the compilation.
41
44
42
- ``` javascript
45
+ ``` js
43
46
compilation .plugin (' optimize' , function () {
44
- // webpack is begining the optimization phase
45
- // no arguments
47
+ // webpack is begining the optimization phase
48
+ // no arguments
46
49
});
47
50
```
48
51
52
+
49
53
## ` optimize-tree(chunks, modules) ` async
50
54
51
55
Async optimization of the tree.
52
56
53
- ``` javascript
57
+ ``` js
54
58
compilation .plugin (' optimize-tree' , function (chunks , modules ) {
55
59
56
60
});
57
61
```
58
62
59
63
#### ` optimize-modules(modules: Module[]) `
64
+
60
65
Optimize the modules.
61
- ``` javascript
66
+
67
+ ``` js
62
68
compilation .plugin (' optimize-modules' , function (modules ) {
63
- // handle to the modules array during tree optimization
69
+ // handle to the modules array during tree optimization
64
70
});
65
71
```
66
72
73
+
67
74
## ` after-optimize-modules(modules: Module[]) `
68
75
69
76
Optimizing the modules has finished.
70
77
78
+
71
79
## ` optimize-chunks(chunks: Chunk[]) `
72
80
73
81
Optimize the chunks.
@@ -91,73 +99,89 @@ compilation.plugin('optimize-chunks', function(chunks) {
91
99
92
100
Optimizing the chunks has finished.
93
101
102
+
94
103
## ` revive-modules(modules: Module[], records) `
95
104
96
105
Restore module info from records.
97
106
107
+
98
108
## ` optimize-module-order(modules: Module[]) `
99
109
100
110
Sort the modules in order of importance. The first is the most important module. It will get the smallest id.
101
111
112
+
102
113
## ` optimize-module-ids(modules: Module[]) `
103
114
104
115
Optimize the module ids.
105
116
117
+
106
118
## ` after-optimize-module-ids(modules: Module[]) `
107
119
108
120
Optimizing the module ids has finished.
109
121
122
+
110
123
## ` record-modules(modules: Module[], records) `
111
124
112
125
Store module info to the records.
113
126
127
+
114
128
## ` revive-chunks(chunks: Chunk[], records) `
115
129
116
130
Restore chunk info from records.
117
131
132
+
118
133
## ` optimize-chunk-order(chunks: Chunk[]) `
119
134
120
135
Sort the chunks in order of importance. The first is the most important chunk. It will get the smallest id.
121
136
137
+
122
138
## ` optimize-chunk-ids(chunks: Chunk[]) `
123
139
124
140
Optimize the chunk ids.
125
141
142
+
126
143
## ` after-optimize-chunk-ids(chunks: Chunk[]) `
127
144
128
145
Optimizing the chunk ids has finished.
129
146
147
+
130
148
## ` record-chunks(chunks: Chunk[], records) `
131
149
132
150
Store chunk info to the records.
133
151
152
+
134
153
## ` before-hash `
135
154
136
155
Before the compilation is hashed.
137
156
157
+
138
158
## ` after-hash `
139
159
140
160
After the compilation is hashed.
141
161
162
+
142
163
## ` before-chunk-assets `
143
164
144
165
Before creating the chunk assets.
145
166
167
+
146
168
## ` additional-chunk-assets(chunks: Chunk[]) `
147
169
148
170
Create additional assets for the chunks.
149
171
172
+
150
173
## ` record(compilation, records) `
151
174
152
175
Store info about the compilation to the records
153
176
177
+
154
178
## ` additional-assets ` async
155
179
156
180
Create additional assets for the compilation
157
181
158
182
Here's an example that downloads an image.
159
183
160
- ``` javascript
184
+ ``` js
161
185
compiler .plugin (' compilation' , function (compilation ) {
162
186
compilation .plugin (' additional-assets' , function (callback ) {
163
187
download (' https://img.shields.io/npm/v/webpack.svg' , function (resp ) {
@@ -172,6 +196,7 @@ compiler.plugin('compilation', function(compilation) {
172
196
});
173
197
```
174
198
199
+
175
200
## ` optimize-chunk-assets(chunks: Chunk[]) ` async
176
201
177
202
Optimize the assets for the chunks.
@@ -180,85 +205,92 @@ The assets are stored in `this.assets`, but not all of them are chunk assets. A
180
205
181
206
Here's an example that simply adds a banner to each chunk.
182
207
183
- ``` javascript
208
+ ``` js
184
209
compilation .plugin (" optimize-chunk-assets" , function (chunks , callback ) {
185
- chunks .forEach (function (chunk ) {
186
- chunk .files .forEach (function (file ) {
187
- compilation .assets [file] = new ConcatSource (" \/ **Sweet Banner**\/ " , " \n " , compilation .assets [file]);
188
- });
210
+ chunks .forEach (function (chunk ) {
211
+ chunk .files .forEach (function (file ) {
212
+ compilation .assets [file] = new ConcatSource (" \/ **Sweet Banner**\/ " , " \n " , compilation .assets [file]);
189
213
});
190
- callback ();
214
+ });
215
+ callback ();
191
216
});
192
217
```
193
218
194
219
## ` after-optimize-chunk-assets(chunks: Chunk[]) `
195
220
196
221
The chunk assets have been optimized. Here's an example plugin from [ @boopathi ] ( https://github.com/boopathi ) that outputs exactly what went into each chunk.
197
222
198
- ``` javascript
223
+ ``` js
199
224
var PrintChunksPlugin = function () {};
225
+
200
226
PrintChunksPlugin .prototype .apply = function (compiler ) {
201
- compiler .plugin (' compilation' , function (compilation , params ) {
202
- compilation .plugin (' after-optimize-chunk-assets' , function (chunks ) {
203
- console .log (chunks .map (function (c ) {
204
- return {
205
- id: c .id ,
206
- name: c .name ,
207
- includes: c .modules .map (function (m ) {
208
- return m .request ;
209
- })
210
- };
211
- }));
212
- });
227
+ compiler .plugin (' compilation' , function (compilation , params ) {
228
+ compilation .plugin (' after-optimize-chunk-assets' , function (chunks ) {
229
+ console .log (chunks .map (function (c ) {
230
+ return {
231
+ id: c .id ,
232
+ name: c .name ,
233
+ includes: c .modules .map (function (m ) {
234
+ return m .request ;
235
+ })
236
+ };
237
+ }));
213
238
});
239
+ });
214
240
};
215
241
```
216
242
243
+
217
244
## ` optimize-assets(assets: Object{name: Source}) ` async
218
245
219
246
Optimize all assets.
220
247
221
248
The assets are stored in ` this.assets ` .
222
249
250
+
223
251
## ` after-optimize-assets(assets: Object{name: Source}) `
224
252
225
253
The assets has been optimized.
226
254
255
+
227
256
## ` build-module(module) `
228
257
229
258
Before a module build has started.
230
259
231
- ``` javascript
260
+ ``` js
232
261
compilation .plugin (' build-module' , function (module ){
233
- console .log (' build module' );
234
- console .log (module );
262
+ console .log (' About to build: ' , module );
235
263
});
236
264
```
237
265
266
+
238
267
## ` succeed-module(module) `
239
268
240
269
A module has been built successfully.
241
- ``` javascript
270
+
271
+ ``` js
242
272
compilation .plugin (' succeed-module' , function (module ){
243
- console .log (' succeed module' );
244
- console .log (module );
273
+ console .log (' Successfully built: ' , module );
245
274
});
246
275
```
247
276
277
+
248
278
## ` failed-module(module) `
249
279
250
280
The module build has failed.
251
- ``` javascript
281
+
282
+ ``` js
252
283
compilation .plugin (' failed-module' , function (module ){
253
- console .log (' failed module' );
254
- console .log (module );
284
+ console .log (' Failed to build: ' , module );
255
285
});
256
286
```
257
287
288
+
258
289
## ` module-asset(module, filename) `
259
290
260
291
An asset from a module was added to the compilation.
261
292
293
+
262
294
## ` chunk-asset(chunk, filename) `
263
295
264
296
An asset from a chunk was added to the compilation.
0 commit comments