Skip to content

Commit 84933cc

Browse files
refactor: code
1 parent 265fc59 commit 84933cc

File tree

10 files changed

+165
-149
lines changed

10 files changed

+165
-149
lines changed

Diff for: src/CssDependencyTemplate.js

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
export default class CssDependencyTemplate {
2+
// eslint-disable-next-line class-methods-use-this
3+
apply() {}
4+
}

Diff for: src/CssModule.js

+68
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
import webpack from 'webpack';
2+
3+
import { MODULE_TYPE } from './utils';
4+
5+
export default class CssModule extends webpack.Module {
6+
constructor(dependency) {
7+
super(MODULE_TYPE, dependency.context);
8+
9+
this.id = '';
10+
this._identifier = dependency.identifier;
11+
this._identifierIndex = dependency.identifierIndex;
12+
this.content = dependency.content;
13+
this.media = dependency.media;
14+
this.sourceMap = dependency.sourceMap;
15+
}
16+
17+
// no source() so webpack doesn't do add stuff to the bundle
18+
19+
size() {
20+
return this.content.length;
21+
}
22+
23+
identifier() {
24+
return `css ${this._identifier} ${this._identifierIndex}`;
25+
}
26+
27+
readableIdentifier(requestShortener) {
28+
return `css ${requestShortener.shorten(this._identifier)}${
29+
this._identifierIndex ? ` (${this._identifierIndex})` : ''
30+
}`;
31+
}
32+
33+
nameForCondition() {
34+
const resource = this._identifier.split('!').pop();
35+
const idx = resource.indexOf('?');
36+
37+
if (idx >= 0) {
38+
return resource.substring(0, idx);
39+
}
40+
41+
return resource;
42+
}
43+
44+
updateCacheModule(module) {
45+
this.content = module.content;
46+
this.media = module.media;
47+
this.sourceMap = module.sourceMap;
48+
}
49+
50+
// eslint-disable-next-line class-methods-use-this
51+
needRebuild() {
52+
return true;
53+
}
54+
55+
build(options, compilation, resolver, fileSystem, callback) {
56+
this.buildInfo = {};
57+
this.buildMeta = {};
58+
callback();
59+
}
60+
61+
updateHash(hash, context) {
62+
super.updateHash(hash, context);
63+
64+
hash.update(this.content);
65+
hash.update(this.media || '');
66+
hash.update(this.sourceMap ? JSON.stringify(this.sourceMap) : '');
67+
}
68+
}

Diff for: src/CssModuleFactory.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import CssModule from './CssModule';
2+
3+
export default class CssModuleFactory {
4+
// eslint-disable-next-line class-methods-use-this
5+
create({ dependencies: [dependency] }, callback) {
6+
callback(null, new CssModule(dependency));
7+
}
8+
}

Diff for: src/index.js

+3-89
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,11 @@ import webpack, { version as webpackVersion } from 'webpack';
44

55
import validateOptions from 'schema-utils';
66

7+
import CssModuleFactory from './CssModuleFactory';
8+
import CssDependencyTemplate from './CssDependencyTemplate';
79
import CssDependency from './CssDependency';
810
import schema from './plugin-options.json';
11+
import { MODULE_TYPE, compareModulesByIdentifier } from './utils';
912

1013
// webpack 5 exposes the sources property to ensure the right version of webpack-sources is used
1114
const { ConcatSource, SourceMapSource, OriginalSource } =
@@ -19,8 +22,6 @@ const {
1922

2023
const isWebpack4 = webpackVersion[0] === '4';
2124

22-
const MODULE_TYPE = 'css/mini-extract';
23-
2425
const pluginName = 'mini-css-extract-plugin';
2526

2627
const REGEXP_CHUNKHASH = /\[chunkhash(?::(\d+))?\]/i;
@@ -29,93 +30,6 @@ const REGEXP_NAME = /\[name\]/i;
2930
const REGEXP_PLACEHOLDERS = /\[(name|id|chunkhash)\]/g;
3031
const DEFAULT_FILENAME = '[name].css';
3132

32-
const compareIds = (a, b) => {
33-
if (typeof a !== typeof b) {
34-
return typeof a < typeof b ? -1 : 1;
35-
}
36-
if (a < b) return -1;
37-
if (a > b) return 1;
38-
return 0;
39-
};
40-
41-
const compareModulesByIdentifier = (a, b) => {
42-
return compareIds(a.identifier(), b.identifier());
43-
};
44-
45-
class CssDependencyTemplate {
46-
apply() {}
47-
}
48-
49-
class CssModule extends webpack.Module {
50-
constructor(dependency) {
51-
super(MODULE_TYPE, dependency.context);
52-
53-
this.id = '';
54-
this._identifier = dependency.identifier;
55-
this._identifierIndex = dependency.identifierIndex;
56-
this.content = dependency.content;
57-
this.media = dependency.media;
58-
this.sourceMap = dependency.sourceMap;
59-
}
60-
61-
// no source() so webpack doesn't do add stuff to the bundle
62-
63-
size() {
64-
return this.content.length;
65-
}
66-
67-
identifier() {
68-
return `css ${this._identifier} ${this._identifierIndex}`;
69-
}
70-
71-
readableIdentifier(requestShortener) {
72-
return `css ${requestShortener.shorten(this._identifier)}${
73-
this._identifierIndex ? ` (${this._identifierIndex})` : ''
74-
}`;
75-
}
76-
77-
nameForCondition() {
78-
const resource = this._identifier.split('!').pop();
79-
const idx = resource.indexOf('?');
80-
81-
if (idx >= 0) {
82-
return resource.substring(0, idx);
83-
}
84-
85-
return resource;
86-
}
87-
88-
updateCacheModule(module) {
89-
this.content = module.content;
90-
this.media = module.media;
91-
this.sourceMap = module.sourceMap;
92-
}
93-
94-
needRebuild() {
95-
return true;
96-
}
97-
98-
build(options, compilation, resolver, fileSystem, callback) {
99-
this.buildInfo = {};
100-
this.buildMeta = {};
101-
callback();
102-
}
103-
104-
updateHash(hash, context) {
105-
super.updateHash(hash, context);
106-
107-
hash.update(this.content);
108-
hash.update(this.media || '');
109-
hash.update(this.sourceMap ? JSON.stringify(this.sourceMap) : '');
110-
}
111-
}
112-
113-
class CssModuleFactory {
114-
create({ dependencies: [dependency] }, callback) {
115-
callback(null, new CssModule(dependency));
116-
}
117-
}
118-
11933
class MiniCssExtractPlugin {
12034
constructor(options = {}) {
12135
validateOptions(schema, options, 'Mini CSS Extract Plugin');

Diff for: src/loader.js

+1-30
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
import NativeModule from 'module';
2-
31
import path from 'path';
42

53
import loaderUtils from 'loader-utils';
@@ -13,7 +11,7 @@ import NormalModule from 'webpack/lib/NormalModule';
1311
import validateOptions from 'schema-utils';
1412

1513
import CssDependency from './CssDependency';
16-
14+
import { findModuleById, evalModuleCode } from './utils';
1715
import schema from './loader-options.json';
1816

1917
const pluginName = 'mini-css-extract-plugin';
@@ -41,33 +39,6 @@ function hotLoader(content, context) {
4139
`;
4240
}
4341

44-
function evalModuleCode(loaderContext, code, filename) {
45-
const module = new NativeModule(filename, loaderContext);
46-
47-
module.paths = NativeModule._nodeModulePaths(loaderContext.context); // eslint-disable-line no-underscore-dangle
48-
module.filename = filename;
49-
module._compile(code, filename); // eslint-disable-line no-underscore-dangle
50-
51-
return module.exports;
52-
}
53-
54-
function findModuleById(compilation, id) {
55-
const { modules, chunkGraph } = compilation;
56-
57-
for (const module of modules) {
58-
const moduleId =
59-
typeof chunkGraph !== 'undefined'
60-
? chunkGraph.getModuleId(module)
61-
: module.id;
62-
63-
if (moduleId === id) {
64-
return module;
65-
}
66-
}
67-
68-
return null;
69-
}
70-
7142
export function pitch(request) {
7243
const options = loaderUtils.getOptions(this) || {};
7344

Diff for: src/utils.js

+57
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
import NativeModule from 'module';
2+
3+
const MODULE_TYPE = 'css/mini-extract';
4+
5+
function findModuleById(compilation, id) {
6+
const { modules, chunkGraph } = compilation;
7+
8+
for (const module of modules) {
9+
const moduleId =
10+
typeof chunkGraph !== 'undefined'
11+
? chunkGraph.getModuleId(module)
12+
: module.id;
13+
14+
if (moduleId === id) {
15+
return module;
16+
}
17+
}
18+
19+
return null;
20+
}
21+
22+
function evalModuleCode(loaderContext, code, filename) {
23+
const module = new NativeModule(filename, loaderContext);
24+
25+
module.paths = NativeModule._nodeModulePaths(loaderContext.context); // eslint-disable-line no-underscore-dangle
26+
module.filename = filename;
27+
module._compile(code, filename); // eslint-disable-line no-underscore-dangle
28+
29+
return module.exports;
30+
}
31+
32+
function compareIds(a, b) {
33+
if (typeof a !== typeof b) {
34+
return typeof a < typeof b ? -1 : 1;
35+
}
36+
37+
if (a < b) {
38+
return -1;
39+
}
40+
41+
if (a > b) {
42+
return 1;
43+
}
44+
45+
return 0;
46+
}
47+
48+
function compareModulesByIdentifier(a, b) {
49+
return compareIds(a.identifier(), b.identifier());
50+
}
51+
52+
export {
53+
MODULE_TYPE,
54+
findModuleById,
55+
evalModuleCode,
56+
compareModulesByIdentifier,
57+
};

Diff for: test/cases/dependOn-multiple-files-per-entry/expected/webpack-5/common.js

+9-13
Original file line numberDiff line numberDiff line change
@@ -162,17 +162,14 @@ __webpack_require__.r(__webpack_exports__);
162162
/******/ __webpack_require__.x = () => {
163163
/******/
164164
/******/ }
165-
/******/ jsonpArray = jsonpArray.slice();
166-
/******/ for(var i = 0; i < jsonpArray.length; i++) webpackJsonpCallback(jsonpArray[i]);
165+
/******/ chunkLoadingGlobal = chunkLoadingGlobal.slice();
166+
/******/ for(var i = 0; i < chunkLoadingGlobal.length; i++) webpackJsonpCallback(chunkLoadingGlobal[i]);
167167
/******/ return (checkDeferredModules = checkDeferredModulesImpl)();
168168
/******/ };
169169
/******/
170170
/******/ // install a JSONP callback for chunk loading
171-
/******/ function webpackJsonpCallback(data) {
172-
/******/ var chunkIds = data[0];
173-
/******/ var moreModules = data[1];
174-
/******/ var executeModules = data[2];
175-
/******/ var runtime = data[3];
171+
/******/ var webpackJsonpCallback = (data) => {
172+
/******/ var [chunkIds, moreModules, runtime, executeModules] = data;
176173
/******/ // add "moreModules" to the modules object,
177174
/******/ // then flag all "chunkIds" as loaded and fire callback
178175
/******/ var moduleId, chunkId, i = 0, resolves = [];
@@ -189,7 +186,7 @@ __webpack_require__.r(__webpack_exports__);
189186
/******/ }
190187
/******/ }
191188
/******/ if(runtime) runtime(__webpack_require__);
192-
/******/ if(parentJsonpFunction) parentJsonpFunction(data);
189+
/******/ parentChunkLoadingFunction(data);
193190
/******/ while(resolves.length) {
194191
/******/ resolves.shift()();
195192
/******/ }
@@ -199,12 +196,11 @@ __webpack_require__.r(__webpack_exports__);
199196
/******/
200197
/******/ // run deferred modules when all chunks ready
201198
/******/ return checkDeferredModules();
202-
/******/ };
199+
/******/ }
203200
/******/
204-
/******/ var jsonpArray = window["webpackJsonp"] = window["webpackJsonp"] || [];
205-
/******/ var oldJsonpFunction = jsonpArray.push.bind(jsonpArray);
206-
/******/ jsonpArray.push = webpackJsonpCallback;
207-
/******/ var parentJsonpFunction = oldJsonpFunction;
201+
/******/ var chunkLoadingGlobal = self["webpackChunk"] = self["webpackChunk"] || [];
202+
/******/ var parentChunkLoadingFunction = chunkLoadingGlobal.push.bind(chunkLoadingGlobal);
203+
/******/ chunkLoadingGlobal.push = webpackJsonpCallback;
208204
/******/ })();
209205
/******/
210206
/************************************************************************/

Diff for: test/cases/dependOn-multiple-files-per-entry/expected/webpack-5/entry1.js

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],[
1+
(self["webpackChunk"] = self["webpackChunk"] || []).push([[1],[
22
/* 0 */,
33
/* 1 */,
44
/* 2 */,
@@ -37,4 +37,5 @@ __webpack_require__.r(__webpack_exports__);
3737
// extracted by mini-css-extract-plugin
3838

3939
/***/ })
40-
],[[6,0],[4,0]]]);
40+
],
41+
0,[[6,0],[4,0]]]);

0 commit comments

Comments
 (0)