Skip to content

Commit 6300c5b

Browse files
sokrasokra
committed
reenable example
1 parent 910d6fd commit 6300c5b

File tree

2 files changed

+356
-0
lines changed

2 files changed

+356
-0
lines changed

‎examples/multiple-entry-points-commons-chunk-css-bundle/README.md

Lines changed: 356 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,356 @@
1+
2+
# a.js
3+
4+
``` javascript
5+
require("./style.css");
6+
require("./styleA.css");
7+
```
8+
9+
# b.js
10+
11+
``` javascript
12+
require("./style.css");
13+
require("./styleB.css");
14+
```
15+
16+
# c.js
17+
18+
``` javascript
19+
require("./styleC.css");
20+
```
21+
22+
# style.css
23+
24+
``` css
25+
body {
26+
background: url(image.png);
27+
}
28+
```
29+
30+
# styleA.css
31+
32+
``` css
33+
.a {
34+
background: url(imageA.png);
35+
}
36+
```
37+
38+
# styleB.css
39+
40+
``` css
41+
.b {
42+
background: url(imageB.png);
43+
}
44+
```
45+
46+
# styleC.css
47+
48+
``` css
49+
@import "style.css";
50+
.c {
51+
background: url(imageC.png);
52+
}
53+
```
54+
55+
# webpack.config.js
56+
57+
``` javascript
58+
const path = require("path");
59+
const LoaderOptionsPlugin = require("../../lib/LoaderOptionsPlugin");
60+
const CommonsChunkPlugin = require("../../lib/optimize/CommonsChunkPlugin");
61+
const ExtractTextPlugin = require("extract-text-webpack-plugin");
62+
module.exports = {
63+
// mode: "development || "production",
64+
entry: {
65+
A: "./a",
66+
B: "./b",
67+
C: "./c",
68+
},
69+
output: {
70+
path: path.join(__dirname, "js"),
71+
filename: "[name].js"
72+
},
73+
module: {
74+
rules: [
75+
{
76+
test: /\.css$/,
77+
use: ExtractTextPlugin.extract({
78+
fallback: "style-loader",
79+
use: "css-loader"
80+
})
81+
},
82+
{ test: /\.png$/, loader: "file-loader" }
83+
]
84+
},
85+
plugins: [
86+
new CommonsChunkPlugin({
87+
name: "commons",
88+
filename: "commons.js",
89+
chunks: ["A", "B"]
90+
}),
91+
new ExtractTextPlugin({
92+
filename: "[name].css"
93+
}),
94+
// Temporary workaround for the file-loader
95+
new LoaderOptionsPlugin({
96+
options: {}
97+
})
98+
]
99+
};
100+
```
101+
102+
# js/A.js
103+
104+
``` javascript
105+
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[0],{
106+
107+
/***/ 0:
108+
/*!**************!*\
109+
!*** ./a.js ***!
110+
\**************/
111+
/*! no static exports found */
112+
/***/ (function(module, exports, __webpack_require__) {
113+
114+
__webpack_require__(/*! ./style.css */ 1);
115+
__webpack_require__(/*! ./styleA.css */ 7);
116+
117+
118+
/***/ }),
119+
120+
/***/ 7:
121+
/*!********************!*\
122+
!*** ./styleA.css ***!
123+
\********************/
124+
/*! no static exports found */
125+
/***/ (function(module, exports) {
126+
127+
// removed by extract-text-webpack-plugin
128+
129+
/***/ })
130+
131+
},[[0,3,0]]]);
132+
```
133+
134+
# js/commons.css
135+
136+
``` css
137+
body {
138+
background: url(js/ce21cbdd9b894e6af794813eb3fdaf60.png);
139+
}
140+
```
141+
142+
# js/A.css
143+
144+
``` css
145+
.a {
146+
background: url(js/d090b6fba0f6d326d282a19146ff54a7.png);
147+
}
148+
```
149+
150+
# js/B.css
151+
152+
``` css
153+
.b {
154+
background: url(js/16155c689e517682064c99893cb832cc.png);
155+
}
156+
```
157+
158+
# js/B.css (Minimized)
159+
160+
``` css
161+
.b {
162+
background: url(js/16155c689e517682064c99893cb832cc.png);
163+
}
164+
```
165+
166+
# js/C.css
167+
168+
``` css
169+
body {
170+
background: url(js/ce21cbdd9b894e6af794813eb3fdaf60.png);
171+
}
172+
.c {
173+
background: url(js/c2a2f62d69330b7d787782f5010f9d13.png);
174+
}
175+
```
176+
177+
# js/C.css (Minimized)
178+
179+
``` css
180+
body {
181+
background: url(js/ce21cbdd9b894e6af794813eb3fdaf60.png);
182+
}
183+
.c {
184+
background: url(js/c2a2f62d69330b7d787782f5010f9d13.png);
185+
}
186+
```
187+
188+
# Info
189+
190+
## Unoptimized
191+
192+
```
193+
Hash: 0a1b2c3d4e5f6a7b8c9d
194+
Version: webpack 4.0.0-alpha.2
195+
Asset Size Chunks Chunk Names
196+
C.js 2.97 KiB 2 [emitted] C
197+
d090b6fba0f6d326d282a19146ff54a7.png 120 bytes [emitted]
198+
ce21cbdd9b894e6af794813eb3fdaf60.png 119 bytes [emitted]
199+
c2a2f62d69330b7d787782f5010f9d13.png 120 bytes [emitted]
200+
A.js 547 bytes 0 [emitted] A
201+
B.js 551 bytes 1 [emitted] B
202+
16155c689e517682064c99893cb832cc.png 120 bytes [emitted]
203+
commons.js 7.25 KiB 3 [emitted] commons
204+
A.css 69 bytes 0 [emitted] A
205+
B.css 69 bytes 1 [emitted] B
206+
C.css 140 bytes 2 [emitted] C
207+
commons.css 71 bytes 3 [emitted] commons
208+
Entrypoint A = commons.js commons.css A.js A.css
209+
Entrypoint B = commons.js commons.css B.js B.css
210+
Entrypoint C = C.js C.css
211+
chunk {0} A.js, A.css (A) 92 bytes {3} [initial] [rendered]
212+
> A [0] ./a.js
213+
[0] ./a.js 51 bytes {0} [built]
214+
single entry ./a A
215+
[7] ./styleA.css 41 bytes [built]
216+
chunk {1} B.js, B.css (B) 92 bytes {3} [initial] [rendered]
217+
> B [10] ./b.js
218+
[10] ./b.js 51 bytes {1} [built]
219+
single entry ./b B
220+
[11] ./styleB.css 41 bytes [built]
221+
chunk {2} C.js, C.css (C) 67 bytes [entry] [rendered]
222+
> C [14] ./c.js
223+
[14] ./c.js 26 bytes {2} [built]
224+
single entry ./c C
225+
[15] ./styleC.css 41 bytes [built]
226+
chunk {3} commons.js, commons.css (commons) 41 bytes [entry] [rendered]
227+
[1] ./style.css 41 bytes [built]
228+
Child extract-text-webpack-plugin ../../node_modules/extract-text-webpack-plugin/dist ../../node_modules/css-loader/index.js!styleA.css:
229+
1 asset
230+
Entrypoint undefined = extract-text-webpack-plugin-output-filename
231+
chunk {0} extract-text-webpack-plugin-output-filename 2.52 KiB [entry] [rendered]
232+
> [0] (webpack)/node_modules/css-loader!./styleA.css
233+
[0] (webpack)/node_modules/css-loader!./styleA.css 234 bytes {0} [built]
234+
single entry !!(webpack)\node_modules\css-loader\index.js!.\styleA.css
235+
[2] ./imageA.png 82 bytes {0} [built]
236+
cjs require ./imageA.png [0] (webpack)/node_modules/css-loader!./styleA.css 6:56-79
237+
+ 1 hidden module
238+
Child extract-text-webpack-plugin ../../node_modules/extract-text-webpack-plugin/dist ../../node_modules/css-loader/index.js!styleB.css:
239+
1 asset
240+
Entrypoint undefined = extract-text-webpack-plugin-output-filename
241+
chunk {0} extract-text-webpack-plugin-output-filename 2.52 KiB [entry] [rendered]
242+
> [0] (webpack)/node_modules/css-loader!./styleB.css
243+
[0] (webpack)/node_modules/css-loader!./styleB.css 234 bytes {0} [built]
244+
single entry !!(webpack)\node_modules\css-loader\index.js!.\styleB.css
245+
[2] ./imageB.png 82 bytes {0} [built]
246+
cjs require ./imageB.png [0] (webpack)/node_modules/css-loader!./styleB.css 6:56-79
247+
+ 1 hidden module
248+
Child extract-text-webpack-plugin ../../node_modules/extract-text-webpack-plugin/dist ../../node_modules/css-loader/index.js!style.css:
249+
1 asset
250+
Entrypoint undefined = extract-text-webpack-plugin-output-filename
251+
chunk {0} extract-text-webpack-plugin-output-filename 2.52 KiB [entry] [rendered]
252+
> [0] (webpack)/node_modules/css-loader!./style.css
253+
[0] (webpack)/node_modules/css-loader!./style.css 235 bytes {0} [built]
254+
single entry !!(webpack)\node_modules\css-loader\index.js!.\style.css
255+
[2] ./image.png 82 bytes {0} [built]
256+
cjs require ./image.png [0] (webpack)/node_modules/css-loader!./style.css 6:58-80
257+
+ 1 hidden module
258+
Child extract-text-webpack-plugin ../../node_modules/extract-text-webpack-plugin/dist ../../node_modules/css-loader/index.js!styleC.css:
259+
2 assets
260+
Entrypoint undefined = extract-text-webpack-plugin-output-filename
261+
chunk {0} extract-text-webpack-plugin-output-filename 2.9 KiB [entry] [rendered]
262+
> [0] (webpack)/node_modules/css-loader!./styleC.css
263+
[0] (webpack)/node_modules/css-loader!./styleC.css 313 bytes {0} [built]
264+
single entry !!(webpack)\node_modules\css-loader\index.js!.\styleC.css
265+
[2] (webpack)/node_modules/css-loader!./style.css 235 bytes {0} [built]
266+
cjs require -!../../node_modules/css-loader/index.js!./style.css [0] (webpack)/node_modules/css-loader!./styleC.css 3:10-73
267+
[3] ./image.png 82 bytes {0} [built]
268+
cjs require ./image.png [2] (webpack)/node_modules/css-loader!./style.css 6:58-80
269+
[4] ./imageC.png 82 bytes {0} [built]
270+
cjs require ./imageC.png [0] (webpack)/node_modules/css-loader!./styleC.css 6:56-79
271+
+ 1 hidden module
272+
```
273+
274+
## Production mode
275+
276+
```
277+
Hash: 0a1b2c3d4e5f6a7b8c9d
278+
Version: webpack 4.0.0-alpha.2
279+
Asset Size Chunks Chunk Names
280+
commons.js 1.72 KiB 2 [emitted] commons
281+
d090b6fba0f6d326d282a19146ff54a7.png 120 bytes [emitted]
282+
ce21cbdd9b894e6af794813eb3fdaf60.png 119 bytes [emitted]
283+
c2a2f62d69330b7d787782f5010f9d13.png 120 bytes [emitted]
284+
B.js 118 bytes 0 [emitted] B
285+
A.js 120 bytes 1 [emitted] A
286+
16155c689e517682064c99893cb832cc.png 120 bytes [emitted]
287+
C.js 574 bytes 3 [emitted] C
288+
A.css 69 bytes 1 [emitted] A
289+
B.css 69 bytes 0 [emitted] B
290+
C.css 140 bytes 3 [emitted] C
291+
commons.css 71 bytes 2 [emitted] commons
292+
Entrypoint A = commons.js commons.css A.js A.css
293+
Entrypoint B = commons.js commons.css B.js B.css
294+
Entrypoint C = C.js C.css
295+
chunk {0} B.js, B.css (B) 92 bytes {2} [initial] [rendered]
296+
> B [1] ./b.js
297+
[1] ./b.js 51 bytes {0} [built]
298+
single entry ./b B
299+
[8] ./styleB.css 41 bytes [built]
300+
chunk {1} A.js, A.css (A) 92 bytes {2} [initial] [rendered]
301+
> A [2] ./a.js
302+
[2] ./a.js 51 bytes {1} [built]
303+
single entry ./a A
304+
[11] ./styleA.css 41 bytes [built]
305+
chunk {2} commons.js, commons.css (commons) 41 bytes [entry] [rendered]
306+
[17] ./style.css 41 bytes [built]
307+
chunk {3} C.js, C.css (C) 67 bytes [entry] [rendered]
308+
> C [0] ./c.js
309+
[0] ./c.js 26 bytes {3} [built]
310+
single entry ./c C
311+
[5] ./styleC.css 41 bytes [built]
312+
Child extract-text-webpack-plugin ../../node_modules/extract-text-webpack-plugin/dist ../../node_modules/css-loader/index.js!styleA.css:
313+
1 asset
314+
Entrypoint undefined = extract-text-webpack-plugin-output-filename
315+
chunk {0} extract-text-webpack-plugin-output-filename 2.52 KiB [entry] [rendered]
316+
> [2] (webpack)/node_modules/css-loader!./styleA.css
317+
[0] ./imageA.png 82 bytes {0} [built]
318+
cjs require ./imageA.png [2] (webpack)/node_modules/css-loader!./styleA.css 6:56-79
319+
[2] (webpack)/node_modules/css-loader!./styleA.css 234 bytes {0} [built]
320+
single entry !!(webpack)\node_modules\css-loader\index.js!.\styleA.css
321+
+ 1 hidden module
322+
Child extract-text-webpack-plugin ../../node_modules/extract-text-webpack-plugin/dist ../../node_modules/css-loader/index.js!styleB.css:
323+
1 asset
324+
Entrypoint undefined = extract-text-webpack-plugin-output-filename
325+
chunk {0} extract-text-webpack-plugin-output-filename 2.52 KiB [entry] [rendered]
326+
> [2] (webpack)/node_modules/css-loader!./styleB.css
327+
[0] ./imageB.png 82 bytes {0} [built]
328+
cjs require ./imageB.png [2] (webpack)/node_modules/css-loader!./styleB.css 6:56-79
329+
[2] (webpack)/node_modules/css-loader!./styleB.css 234 bytes {0} [built]
330+
single entry !!(webpack)\node_modules\css-loader\index.js!.\styleB.css
331+
+ 1 hidden module
332+
Child extract-text-webpack-plugin ../../node_modules/extract-text-webpack-plugin/dist ../../node_modules/css-loader/index.js!style.css:
333+
1 asset
334+
Entrypoint undefined = extract-text-webpack-plugin-output-filename
335+
chunk {0} extract-text-webpack-plugin-output-filename 2.52 KiB [entry] [rendered]
336+
> [2] (webpack)/node_modules/css-loader!./style.css
337+
[0] ./image.png 82 bytes {0} [built]
338+
cjs require ./image.png [2] (webpack)/node_modules/css-loader!./style.css 6:58-80
339+
[2] (webpack)/node_modules/css-loader!./style.css 235 bytes {0} [built]
340+
single entry !!(webpack)\node_modules\css-loader\index.js!.\style.css
341+
+ 1 hidden module
342+
Child extract-text-webpack-plugin ../../node_modules/extract-text-webpack-plugin/dist ../../node_modules/css-loader/index.js!styleC.css:
343+
2 assets
344+
Entrypoint undefined = extract-text-webpack-plugin-output-filename
345+
chunk {0} extract-text-webpack-plugin-output-filename 2.9 KiB [entry] [rendered]
346+
> [4] (webpack)/node_modules/css-loader!./styleC.css
347+
[1] ./imageC.png 82 bytes {0} [built]
348+
cjs require ./imageC.png [4] (webpack)/node_modules/css-loader!./styleC.css 6:56-79
349+
[2] ./image.png 82 bytes {0} [built]
350+
cjs require ./image.png [3] (webpack)/node_modules/css-loader!./style.css 6:58-80
351+
[3] (webpack)/node_modules/css-loader!./style.css 235 bytes {0} [built]
352+
cjs require -!../../node_modules/css-loader/index.js!./style.css [4] (webpack)/node_modules/css-loader!./styleC.css 3:10-73
353+
[4] (webpack)/node_modules/css-loader!./styleC.css 313 bytes {0} [built]
354+
single entry !!(webpack)\node_modules\css-loader\index.js!.\styleC.css
355+
+ 1 hidden module
356+
```

‎examples/multiple-entry-points-commons-chunk-css-bundle/template.disabled.md renamed to ‎examples/multiple-entry-points-commons-chunk-css-bundle/template.md

File renamed without changes.

0 commit comments

Comments
 (0)