@compiled/webpack-loader 0.8.7 → 0.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/__fixtures__/lib/loader-alias.d.ts +1 -1
- package/dist/__fixtures__/lib/webpack-alias.d.ts +1 -1
- package/dist/compiled-loader.js +18 -7
- package/dist/compiled-loader.js.map +1 -1
- package/dist/extract-plugin.js +4 -3
- package/dist/extract-plugin.js.map +1 -1
- package/dist/types.d.ts +21 -2
- package/package.json +10 -10
- package/src/__tests__/extract-plugin.test.ts +8 -0
- package/src/__tests__/test-utils.ts +11 -2
- package/src/compiled-loader.ts +16 -3
- package/src/extract-plugin.ts +7 -3
- package/src/types.ts +24 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const styles: import("@compiled/react").CSSProps
|
|
1
|
+
export declare const styles: import("@compiled/react").CSSProps<unknown>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const styles: import("@compiled/react").CSSProps
|
|
1
|
+
export declare const styles: import("@compiled/react").CSSProps<unknown>;
|
package/dist/compiled-loader.js
CHANGED
|
@@ -30,7 +30,7 @@ let hasErrored = false;
|
|
|
30
30
|
* @returns
|
|
31
31
|
*/
|
|
32
32
|
function getLoaderOptions(context) {
|
|
33
|
-
const { bake = true, extract = false, importReact = undefined, nonce = undefined, resolve = {}, extensions = undefined,
|
|
33
|
+
const { bake = true, extract = false, importReact = undefined, nonce = undefined, resolve = {}, extensions = undefined, parserBabelPlugins = [], transformerBabelPlugins = [], [extract_plugin_1.pluginName]: isPluginEnabled = false, ssr = false, } = typeof context.getOptions === 'undefined'
|
|
34
34
|
? // Webpack v4 flow
|
|
35
35
|
(0, loader_utils_1.getOptions)(context)
|
|
36
36
|
: // Webpack v5 flow
|
|
@@ -55,12 +55,18 @@ function getLoaderOptions(context) {
|
|
|
55
55
|
extensions: {
|
|
56
56
|
type: 'array',
|
|
57
57
|
},
|
|
58
|
-
|
|
58
|
+
parserBabelPlugins: {
|
|
59
|
+
type: 'array',
|
|
60
|
+
},
|
|
61
|
+
transformerBabelPlugins: {
|
|
59
62
|
type: 'array',
|
|
60
63
|
},
|
|
61
64
|
[extract_plugin_1.pluginName]: {
|
|
62
65
|
type: 'boolean',
|
|
63
66
|
},
|
|
67
|
+
ssr: {
|
|
68
|
+
type: 'boolean',
|
|
69
|
+
},
|
|
64
70
|
},
|
|
65
71
|
});
|
|
66
72
|
return {
|
|
@@ -70,8 +76,10 @@ function getLoaderOptions(context) {
|
|
|
70
76
|
nonce,
|
|
71
77
|
resolve,
|
|
72
78
|
extensions,
|
|
73
|
-
|
|
79
|
+
parserBabelPlugins,
|
|
80
|
+
transformerBabelPlugins,
|
|
74
81
|
[extract_plugin_1.pluginName]: isPluginEnabled,
|
|
82
|
+
ssr,
|
|
75
83
|
};
|
|
76
84
|
}
|
|
77
85
|
/**
|
|
@@ -81,7 +89,7 @@ function getLoaderOptions(context) {
|
|
|
81
89
|
* @param code
|
|
82
90
|
*/
|
|
83
91
|
async function compiledLoader(code) {
|
|
84
|
-
var _a, _b, _c;
|
|
92
|
+
var _a, _b, _c, _d, _e;
|
|
85
93
|
const callback = this.async();
|
|
86
94
|
// Bail early if Compiled isn't in the module or we're looking at compiled runtime code
|
|
87
95
|
if (code.indexOf('@compiled/react') === -1 ||
|
|
@@ -90,19 +98,20 @@ async function compiledLoader(code) {
|
|
|
90
98
|
}
|
|
91
99
|
try {
|
|
92
100
|
const includedFiles = [];
|
|
93
|
-
const
|
|
101
|
+
const _f = getLoaderOptions(this), { resolve } = _f, options = __rest(_f, ["resolve"]);
|
|
94
102
|
// Transform to an AST using the local babel config.
|
|
95
103
|
const ast = await (0, core_1.parseAsync)(code, {
|
|
96
104
|
filename: this.resourcePath,
|
|
97
105
|
caller: { name: 'compiled' },
|
|
98
106
|
rootMode: 'upward-optional',
|
|
107
|
+
plugins: (_a = options.transformerBabelPlugins) !== null && _a !== void 0 ? _a : undefined,
|
|
99
108
|
});
|
|
100
109
|
// Setup the default resolver, where webpack will merge any passed in options with the default
|
|
101
110
|
// resolve configuration. Ideally, we use this.getResolve({ ...resolve, useSyncFileSystemCalls: true, })
|
|
102
111
|
// However, it does not work correctly when in development mode :/
|
|
103
112
|
const resolver = enhanced_resolve_1.ResolverFactory.createResolver(Object.assign(Object.assign(Object.assign({
|
|
104
113
|
// @ts-expect-error
|
|
105
|
-
fileSystem: new enhanced_resolve_1.CachedInputFileSystem(fs_1.default, 4000) }, ((
|
|
114
|
+
fileSystem: new enhanced_resolve_1.CachedInputFileSystem(fs_1.default, 4000) }, ((_c = (_b = this._compilation) === null || _b === void 0 ? void 0 : _b.options.resolve) !== null && _c !== void 0 ? _c : {})), resolve), {
|
|
106
115
|
// This makes the resolver invoke the callback synchronously
|
|
107
116
|
useSyncFileSystemCalls: true }));
|
|
108
117
|
// Transform using the Compiled Babel Plugin - we deliberately turn off using the local config.
|
|
@@ -112,10 +121,12 @@ async function compiledLoader(code) {
|
|
|
112
121
|
sourceMaps: true,
|
|
113
122
|
filename: this.resourcePath,
|
|
114
123
|
plugins: [
|
|
124
|
+
...((_d = options.transformerBabelPlugins) !== null && _d !== void 0 ? _d : []),
|
|
115
125
|
options.extract && [
|
|
116
126
|
'@compiled/babel-plugin-strip-runtime',
|
|
117
127
|
{
|
|
118
128
|
styleSheetPath: `@compiled/webpack-loader/css-loader!@compiled/webpack-loader/css-loader/${extract_plugin_1.styleSheetName}.css`,
|
|
129
|
+
compiledRequireExclude: options.ssr,
|
|
119
130
|
},
|
|
120
131
|
],
|
|
121
132
|
options.bake && [
|
|
@@ -132,7 +143,7 @@ async function compiledLoader(code) {
|
|
|
132
143
|
includedFiles.forEach((file) => {
|
|
133
144
|
this.addDependency((0, path_1.normalize)(file));
|
|
134
145
|
});
|
|
135
|
-
callback(null, (result === null || result === void 0 ? void 0 : result.code) || '', (
|
|
146
|
+
callback(null, (result === null || result === void 0 ? void 0 : result.code) || '', (_e = result === null || result === void 0 ? void 0 : result.map) !== null && _e !== void 0 ? _e : undefined);
|
|
136
147
|
}
|
|
137
148
|
catch (e) {
|
|
138
149
|
// @ts-expect-error Not checking for error type
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compiled-loader.js","sourceRoot":"","sources":["../src/compiled-loader.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,4CAAoB;AACpB,+BAA0C;AAE1C,sCAAgE;AAChE,2CAAyD;AACzD,uDAA0E;AAC1E,+CAA0C;AAG1C,qDAA8D;AAG9D,IAAI,UAAU,GAAG,KAAK,CAAC;AAEvB;;;;;GAKG;AACH,SAAS,gBAAgB,CAAC,OAA6C;IACrE,MAAM,EACJ,IAAI,GAAG,IAAI,EACX,OAAO,GAAG,KAAK,EACf,WAAW,GAAG,SAAS,EACvB,KAAK,GAAG,SAAS,EACjB,OAAO,GAAG,EAAE,EACZ,UAAU,GAAG,SAAS,EACtB,
|
|
1
|
+
{"version":3,"file":"compiled-loader.js","sourceRoot":"","sources":["../src/compiled-loader.ts"],"names":[],"mappings":"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"}
|
package/dist/extract-plugin.js
CHANGED
|
@@ -39,7 +39,7 @@ const getCSSAssets = (assets) => {
|
|
|
39
39
|
*
|
|
40
40
|
* @param compiler
|
|
41
41
|
*/
|
|
42
|
-
const forceCSSIntoOneStyleSheet = (compiler) => {
|
|
42
|
+
const forceCSSIntoOneStyleSheet = (compiler, options) => {
|
|
43
43
|
const cacheGroup = {
|
|
44
44
|
compiledCSS: {
|
|
45
45
|
name: exports.styleSheetName,
|
|
@@ -48,6 +48,7 @@ const forceCSSIntoOneStyleSheet = (compiler) => {
|
|
|
48
48
|
// We merge only CSS from Compiled.
|
|
49
49
|
test: /css-loader\/compiled-css\.css$/,
|
|
50
50
|
enforce: true,
|
|
51
|
+
priority: Infinity,
|
|
51
52
|
},
|
|
52
53
|
};
|
|
53
54
|
if (!compiler.options.optimization) {
|
|
@@ -61,7 +62,7 @@ const forceCSSIntoOneStyleSheet = (compiler) => {
|
|
|
61
62
|
if (!compiler.options.optimization.splitChunks.cacheGroups) {
|
|
62
63
|
compiler.options.optimization.splitChunks.cacheGroups = {};
|
|
63
64
|
}
|
|
64
|
-
Object.assign(compiler.options.optimization.splitChunks.cacheGroups, cacheGroup);
|
|
65
|
+
Object.assign(compiler.options.optimization.splitChunks.cacheGroups, options.cacheGroupExclude ? {} : cacheGroup);
|
|
65
66
|
};
|
|
66
67
|
/**
|
|
67
68
|
* Pushes a new loader onto the compiler.
|
|
@@ -101,7 +102,7 @@ class CompiledExtractPlugin {
|
|
|
101
102
|
apply(compiler) {
|
|
102
103
|
const { RawSource } = (0, utils_2.getSources)(compiler);
|
|
103
104
|
pushNodeModulesExtractLoader(compiler, __classPrivateFieldGet(this, _CompiledExtractPlugin_options, "f"));
|
|
104
|
-
forceCSSIntoOneStyleSheet(compiler);
|
|
105
|
+
forceCSSIntoOneStyleSheet(compiler, __classPrivateFieldGet(this, _CompiledExtractPlugin_options, "f"));
|
|
105
106
|
compiler.hooks.compilation.tap(exports.pluginName, (compilation) => {
|
|
106
107
|
(0, utils_2.setPluginConfiguredOption)(compilation.options.module.rules, exports.pluginName);
|
|
107
108
|
(0, utils_2.getOptimizeAssetsHook)(compiler, compilation).tap(exports.pluginName, (assets) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"extract-plugin.js","sourceRoot":"","sources":["../src/extract-plugin.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,uCAAqC;AACrC,2CAAyD;AAIzD,mCAKiB;AAEJ,QAAA,UAAU,GAAG,uBAAuB,CAAC;AACrC,QAAA,cAAc,GAAG,cAAc,CAAC;AAE7C;;;;;;GAMG;AACH,MAAM,YAAY,GAAG,CAAC,MAA6B,EAAE,EAAE;IACrD,OAAO,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC;SACvB,MAAM,CAAC,CAAC,SAAS,EAAE,EAAE;QACpB,OAAO,SAAS,CAAC,QAAQ,CAAC,GAAG,sBAAc,MAAM,CAAC,CAAC;IACrD,CAAC,CAAC;SACD,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC;AACpF,CAAC,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,yBAAyB,GAAG,CAAC,QAAkB,EAAE,EAAE;
|
|
1
|
+
{"version":3,"file":"extract-plugin.js","sourceRoot":"","sources":["../src/extract-plugin.ts"],"names":[],"mappings":"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"}
|
package/dist/types.d.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { PluginItem } from '@babel/core';
|
|
1
2
|
import type { ParserPlugin } from '@babel/parser';
|
|
2
3
|
import type { ResolveOptions, RuleSetCondition } from 'webpack';
|
|
3
4
|
import type { pluginName } from './extract-plugin';
|
|
@@ -32,13 +33,26 @@ export interface CompiledLoaderOptions {
|
|
|
32
33
|
*/
|
|
33
34
|
extensions?: string[];
|
|
34
35
|
/**
|
|
35
|
-
* List of babel plugins to be applied to evaluated files
|
|
36
|
+
* List of transformer babel plugins to be applied to evaluated files
|
|
37
|
+
*
|
|
38
|
+
* See the [babel docs](https://babeljs.io/docs/en/plugins/#transform-plugins)
|
|
36
39
|
*/
|
|
37
|
-
|
|
40
|
+
transformerBabelPlugins?: PluginItem[];
|
|
41
|
+
/**
|
|
42
|
+
* List of parse babel plugins to be applied to evaluated files
|
|
43
|
+
*
|
|
44
|
+
* See the [babel docs](https://babeljs.io/docs/en/plugins/#syntax-plugins)
|
|
45
|
+
*/
|
|
46
|
+
parserBabelPlugins?: ParserPlugin[];
|
|
38
47
|
/**
|
|
39
48
|
* Set to true if CompiledExtractPlugin has been set up correctly
|
|
40
49
|
*/
|
|
41
50
|
[pluginName]?: boolean;
|
|
51
|
+
/**
|
|
52
|
+
* Build in a node environment.
|
|
53
|
+
* Defaults to `false`.
|
|
54
|
+
*/
|
|
55
|
+
ssr?: boolean;
|
|
42
56
|
}
|
|
43
57
|
export interface CompiledExtractPluginOptions {
|
|
44
58
|
/**
|
|
@@ -56,4 +70,9 @@ export interface CompiledExtractPluginOptions {
|
|
|
56
70
|
* See: https://webpack.js.org/configuration/module/#condition
|
|
57
71
|
*/
|
|
58
72
|
nodeModulesExclude?: RuleSetCondition;
|
|
73
|
+
/**
|
|
74
|
+
* When set will prevent additional cacheGroup chunk to be created.
|
|
75
|
+
* Eg. This may be required in SSR to prevent side-effects
|
|
76
|
+
*/
|
|
77
|
+
cacheGroupExclude?: boolean;
|
|
59
78
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@compiled/webpack-loader",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.9.0",
|
|
4
4
|
"description": "A familiar and performant compile time CSS-in-JS library for React.",
|
|
5
5
|
"homepage": "https://compiledcssinjs.com/docs/pkg-webpack-loader",
|
|
6
6
|
"bugs": "https://github.com/atlassian-labs/compiled/issues/new?assignees=&labels=bug&template=bug_report.md",
|
|
@@ -20,25 +20,25 @@
|
|
|
20
20
|
"src"
|
|
21
21
|
],
|
|
22
22
|
"dependencies": {
|
|
23
|
-
"@babel/core": "^7.17.
|
|
24
|
-
"@compiled/babel-plugin": "^0.
|
|
25
|
-
"@compiled/babel-plugin-strip-runtime": "^0.
|
|
26
|
-
"@compiled/css": "^0.8.
|
|
27
|
-
"@compiled/react": "0.
|
|
23
|
+
"@babel/core": "^7.17.10",
|
|
24
|
+
"@compiled/babel-plugin": "^0.16.0",
|
|
25
|
+
"@compiled/babel-plugin-strip-runtime": "^0.16.0",
|
|
26
|
+
"@compiled/css": "^0.8.3",
|
|
27
|
+
"@compiled/react": "0.11.0",
|
|
28
28
|
"@compiled/utils": "^0.6.16",
|
|
29
|
-
"enhanced-resolve": "^5.
|
|
29
|
+
"enhanced-resolve": "^5.9.3",
|
|
30
30
|
"loader-utils": "^2.0.2",
|
|
31
31
|
"webpack-sources": "^3.2.3"
|
|
32
32
|
},
|
|
33
33
|
"devDependencies": {
|
|
34
34
|
"babel-loader": "^8.2.4",
|
|
35
35
|
"css-loader": "^6.7.1",
|
|
36
|
-
"memfs": "^3.4.
|
|
36
|
+
"memfs": "^3.4.4",
|
|
37
37
|
"mini-css-extract-plugin": "^1.6.2",
|
|
38
38
|
"react": "^17.0.2",
|
|
39
39
|
"ts-node": "^10.7.0",
|
|
40
|
-
"tsconfig-paths": "^3.
|
|
41
|
-
"webpack": "^5.
|
|
40
|
+
"tsconfig-paths": "^3.14.1",
|
|
41
|
+
"webpack": "^5.71.0"
|
|
42
42
|
},
|
|
43
43
|
"peerDependencies": {
|
|
44
44
|
"webpack": ">= 4.46.0"
|
|
@@ -26,6 +26,14 @@ describe('CompiledExtractPlugin', () => {
|
|
|
26
26
|
]);
|
|
27
27
|
}, 10000);
|
|
28
28
|
|
|
29
|
+
it('should not generate a single style sheet if cacheGroup is disabled', async () => {
|
|
30
|
+
const actual = await bundle(join(fixturesPath, 'local-styles.tsx'), {
|
|
31
|
+
disableCacheGroup: true,
|
|
32
|
+
});
|
|
33
|
+
|
|
34
|
+
expect(actual[assetName]).toBe(undefined);
|
|
35
|
+
}, 10000);
|
|
36
|
+
|
|
29
37
|
it('extracts local styles', async () => {
|
|
30
38
|
const actual = await bundle(join(fixturesPath, 'local-styles.tsx'));
|
|
31
39
|
|
|
@@ -10,13 +10,20 @@ import type { ResolveOptions } from '../index';
|
|
|
10
10
|
export interface BundleOptions {
|
|
11
11
|
extract?: boolean;
|
|
12
12
|
disableExtractPlugin?: boolean;
|
|
13
|
+
disableCacheGroup?: boolean;
|
|
13
14
|
mode: 'development' | 'production';
|
|
14
15
|
resolve?: ResolveOptions;
|
|
15
16
|
}
|
|
16
17
|
|
|
17
18
|
export function bundle(
|
|
18
19
|
entry: string,
|
|
19
|
-
{
|
|
20
|
+
{
|
|
21
|
+
extract = false,
|
|
22
|
+
disableExtractPlugin = false,
|
|
23
|
+
disableCacheGroup = false,
|
|
24
|
+
mode,
|
|
25
|
+
resolve = {},
|
|
26
|
+
}: BundleOptions
|
|
20
27
|
): Promise<Record<string, string>> {
|
|
21
28
|
const outputPath = join(__dirname, 'dist');
|
|
22
29
|
const compiler = webpack({
|
|
@@ -62,7 +69,9 @@ export function bundle(
|
|
|
62
69
|
},
|
|
63
70
|
plugins: [
|
|
64
71
|
new MiniCssExtractPlugin({ filename: 'static/[name].css' }),
|
|
65
|
-
...(disableExtractPlugin
|
|
72
|
+
...(disableExtractPlugin
|
|
73
|
+
? []
|
|
74
|
+
: [new CompiledExtractPlugin(disableCacheGroup ? { cacheGroupExclude: true } : {})]),
|
|
66
75
|
],
|
|
67
76
|
resolve: {
|
|
68
77
|
alias: {
|
package/src/compiled-loader.ts
CHANGED
|
@@ -26,8 +26,10 @@ function getLoaderOptions(context: LoaderContext<CompiledLoaderOptions>) {
|
|
|
26
26
|
nonce = undefined,
|
|
27
27
|
resolve = {},
|
|
28
28
|
extensions = undefined,
|
|
29
|
-
|
|
29
|
+
parserBabelPlugins = [],
|
|
30
|
+
transformerBabelPlugins = [],
|
|
30
31
|
[pluginName]: isPluginEnabled = false,
|
|
32
|
+
ssr = false,
|
|
31
33
|
}: CompiledLoaderOptions = typeof context.getOptions === 'undefined'
|
|
32
34
|
? // Webpack v4 flow
|
|
33
35
|
getOptions(context)
|
|
@@ -53,12 +55,18 @@ function getLoaderOptions(context: LoaderContext<CompiledLoaderOptions>) {
|
|
|
53
55
|
extensions: {
|
|
54
56
|
type: 'array',
|
|
55
57
|
},
|
|
56
|
-
|
|
58
|
+
parserBabelPlugins: {
|
|
59
|
+
type: 'array',
|
|
60
|
+
},
|
|
61
|
+
transformerBabelPlugins: {
|
|
57
62
|
type: 'array',
|
|
58
63
|
},
|
|
59
64
|
[pluginName]: {
|
|
60
65
|
type: 'boolean',
|
|
61
66
|
},
|
|
67
|
+
ssr: {
|
|
68
|
+
type: 'boolean',
|
|
69
|
+
},
|
|
62
70
|
},
|
|
63
71
|
});
|
|
64
72
|
|
|
@@ -69,8 +77,10 @@ function getLoaderOptions(context: LoaderContext<CompiledLoaderOptions>) {
|
|
|
69
77
|
nonce,
|
|
70
78
|
resolve,
|
|
71
79
|
extensions,
|
|
72
|
-
|
|
80
|
+
parserBabelPlugins,
|
|
81
|
+
transformerBabelPlugins,
|
|
73
82
|
[pluginName]: isPluginEnabled,
|
|
83
|
+
ssr,
|
|
74
84
|
};
|
|
75
85
|
}
|
|
76
86
|
|
|
@@ -103,6 +113,7 @@ export default async function compiledLoader(
|
|
|
103
113
|
filename: this.resourcePath,
|
|
104
114
|
caller: { name: 'compiled' },
|
|
105
115
|
rootMode: 'upward-optional',
|
|
116
|
+
plugins: options.transformerBabelPlugins ?? undefined,
|
|
106
117
|
});
|
|
107
118
|
|
|
108
119
|
// Setup the default resolver, where webpack will merge any passed in options with the default
|
|
@@ -124,10 +135,12 @@ export default async function compiledLoader(
|
|
|
124
135
|
sourceMaps: true,
|
|
125
136
|
filename: this.resourcePath,
|
|
126
137
|
plugins: [
|
|
138
|
+
...(options.transformerBabelPlugins ?? []),
|
|
127
139
|
options.extract && [
|
|
128
140
|
'@compiled/babel-plugin-strip-runtime',
|
|
129
141
|
{
|
|
130
142
|
styleSheetPath: `@compiled/webpack-loader/css-loader!@compiled/webpack-loader/css-loader/${styleSheetName}.css`,
|
|
143
|
+
compiledRequireExclude: options.ssr,
|
|
131
144
|
},
|
|
132
145
|
],
|
|
133
146
|
options.bake && [
|
package/src/extract-plugin.ts
CHANGED
|
@@ -35,7 +35,7 @@ const getCSSAssets = (assets: Compilation['assets']) => {
|
|
|
35
35
|
*
|
|
36
36
|
* @param compiler
|
|
37
37
|
*/
|
|
38
|
-
const forceCSSIntoOneStyleSheet = (compiler: Compiler) => {
|
|
38
|
+
const forceCSSIntoOneStyleSheet = (compiler: Compiler, options: CompiledExtractPluginOptions) => {
|
|
39
39
|
const cacheGroup = {
|
|
40
40
|
compiledCSS: {
|
|
41
41
|
name: styleSheetName,
|
|
@@ -44,6 +44,7 @@ const forceCSSIntoOneStyleSheet = (compiler: Compiler) => {
|
|
|
44
44
|
// We merge only CSS from Compiled.
|
|
45
45
|
test: /css-loader\/compiled-css\.css$/,
|
|
46
46
|
enforce: true,
|
|
47
|
+
priority: Infinity,
|
|
47
48
|
},
|
|
48
49
|
};
|
|
49
50
|
|
|
@@ -61,7 +62,10 @@ const forceCSSIntoOneStyleSheet = (compiler: Compiler) => {
|
|
|
61
62
|
compiler.options.optimization.splitChunks.cacheGroups = {};
|
|
62
63
|
}
|
|
63
64
|
|
|
64
|
-
Object.assign(
|
|
65
|
+
Object.assign(
|
|
66
|
+
compiler.options.optimization.splitChunks.cacheGroups,
|
|
67
|
+
options.cacheGroupExclude ? {} : cacheGroup
|
|
68
|
+
);
|
|
65
69
|
};
|
|
66
70
|
|
|
67
71
|
/**
|
|
@@ -110,7 +114,7 @@ export class CompiledExtractPlugin {
|
|
|
110
114
|
const { RawSource } = getSources(compiler);
|
|
111
115
|
|
|
112
116
|
pushNodeModulesExtractLoader(compiler, this.#options);
|
|
113
|
-
forceCSSIntoOneStyleSheet(compiler);
|
|
117
|
+
forceCSSIntoOneStyleSheet(compiler, this.#options);
|
|
114
118
|
|
|
115
119
|
compiler.hooks.compilation.tap(pluginName, (compilation) => {
|
|
116
120
|
setPluginConfiguredOption(compilation.options.module.rules, pluginName);
|
package/src/types.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { PluginItem } from '@babel/core';
|
|
1
2
|
import type { ParserPlugin } from '@babel/parser';
|
|
2
3
|
import type { ResolveOptions, RuleSetCondition } from 'webpack';
|
|
3
4
|
|
|
@@ -41,14 +42,29 @@ export interface CompiledLoaderOptions {
|
|
|
41
42
|
extensions?: string[];
|
|
42
43
|
|
|
43
44
|
/**
|
|
44
|
-
* List of babel plugins to be applied to evaluated files
|
|
45
|
+
* List of transformer babel plugins to be applied to evaluated files
|
|
46
|
+
*
|
|
47
|
+
* See the [babel docs](https://babeljs.io/docs/en/plugins/#transform-plugins)
|
|
45
48
|
*/
|
|
46
|
-
|
|
49
|
+
transformerBabelPlugins?: PluginItem[];
|
|
50
|
+
|
|
51
|
+
/**
|
|
52
|
+
* List of parse babel plugins to be applied to evaluated files
|
|
53
|
+
*
|
|
54
|
+
* See the [babel docs](https://babeljs.io/docs/en/plugins/#syntax-plugins)
|
|
55
|
+
*/
|
|
56
|
+
parserBabelPlugins?: ParserPlugin[];
|
|
47
57
|
|
|
48
58
|
/**
|
|
49
59
|
* Set to true if CompiledExtractPlugin has been set up correctly
|
|
50
60
|
*/
|
|
51
61
|
[pluginName]?: boolean;
|
|
62
|
+
|
|
63
|
+
/**
|
|
64
|
+
* Build in a node environment.
|
|
65
|
+
* Defaults to `false`.
|
|
66
|
+
*/
|
|
67
|
+
ssr?: boolean;
|
|
52
68
|
}
|
|
53
69
|
|
|
54
70
|
export interface CompiledExtractPluginOptions {
|
|
@@ -69,4 +85,10 @@ export interface CompiledExtractPluginOptions {
|
|
|
69
85
|
* See: https://webpack.js.org/configuration/module/#condition
|
|
70
86
|
*/
|
|
71
87
|
nodeModulesExclude?: RuleSetCondition;
|
|
88
|
+
|
|
89
|
+
/**
|
|
90
|
+
* When set will prevent additional cacheGroup chunk to be created.
|
|
91
|
+
* Eg. This may be required in SSR to prevent side-effects
|
|
92
|
+
*/
|
|
93
|
+
cacheGroupExclude?: boolean;
|
|
72
94
|
}
|