@omnia/tooling-vue 8.0.107-vnext → 8.0.108-dev
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/internal-do-not-import-from-here/config/omnia.fx.core_a2892051-fd9f-4056-ae8d-30d16d48417d.manifest.json +1 -0
- package/internal-do-not-import-from-here/config/omnia.fx.ux.libs_0fe5c5f2-8d89-485b-afd4-36fe3ff5943a.manifest.json +1 -0
- package/internal-do-not-import-from-here/config/omnia.fx.ux_dee030cc-4ab3-4158-bb06-8049f5c67542.manifest.json +1 -0
- package/internal-do-not-import-from-here/config/omnia.fx_a5a89056-b5f5-475d-8518-a1f55090379d.manifest.json +1 -0
- package/internal-do-not-import-from-here/config/omnia.vendor.manifest.json +1 -1
- package/internal-do-not-import-from-here/config/tooling.output.json +1 -1
- package/internal-do-not-import-from-here/config/wctypings.d.ts +4465 -1547
- package/internal-do-not-import-from-here/shared.d.ts +32 -10
- package/internal-do-not-import-from-here/shared.js +308 -27
- package/internal-do-not-import-from-here/tasks/ComponentDocRegistrations.js +1 -1
- package/internal-do-not-import-from-here/tasks/bundle.js +92 -32
- package/internal-do-not-import-from-here/tasks/doc.d.ts +1 -0
- package/internal-do-not-import-from-here/tasks/doc.js +125 -183
- package/internal-do-not-import-from-here/tasks/vendor.js +22 -16
- package/internal-do-not-import-from-here/vite/hmr/graph.js +3 -1
- package/internal-do-not-import-from-here/vite/hmr/vueJsx.js +3 -2
- package/internal-do-not-import-from-here/vite/index.js +1 -1
- package/internal-do-not-import-from-here/vite/plugins/OmniaPlugin.js +1 -1
- package/internal-do-not-import-from-here/webpack-loaders/doc-loader.d.ts +1 -0
- package/internal-do-not-import-from-here/webpack-loaders/doc-loader.js +11 -0
- package/internal-do-not-import-from-here/webpack-loaders/esbuild-custom-loader.d.ts +1 -0
- package/internal-do-not-import-from-here/webpack-loaders/esbuild-custom-loader.js +10 -0
- package/internal-do-not-import-from-here/webpack-loaders/ts-loader.d.ts +5 -2
- package/internal-do-not-import-from-here/webpack-loaders/ts-loader.js +8 -0
- package/internal-do-not-import-from-here/webpack-loaders/tsx-loader.d.ts +3 -3
- package/internal-do-not-import-from-here/webpack-loaders/tsx-loader.js +9 -3
- package/internal-do-not-import-from-here/webpack-loaders/vue-component-loader.d.ts +1 -0
- package/internal-do-not-import-from-here/webpack-loaders/{wc-loader.js → vue-component-loader.js} +3 -1
- package/internal-do-not-import-from-here/webpack-plugins/stylexjs/index.d.ts +53 -0
- package/internal-do-not-import-from-here/webpack-plugins/stylexjs/index.js +194 -0
- package/internal-do-not-import-from-here/webpack-plugins/stylexjs/loader.d.ts +9 -0
- package/internal-do-not-import-from-here/webpack-plugins/stylexjs/loader.js +23 -0
- package/package.json +10 -10
- package/internal-do-not-import-from-here/webpack-loaders/wc-loader.d.ts +0 -1
|
@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
const tslib_1 = require("tslib");
|
|
4
4
|
const $ = tslib_1.__importStar(require("../variables"));
|
|
5
5
|
const ts_loader_1 = tslib_1.__importDefault(require("../webpack-loaders/ts-loader"));
|
|
6
|
+
const fsExtra = tslib_1.__importStar(require("fs-extra"));
|
|
6
7
|
const ExtractTextPlugin = require('mini-css-extract-plugin');
|
|
7
|
-
const fsExtra = require('fs-extra');
|
|
8
8
|
const extractCSS = new ExtractTextPlugin({
|
|
9
9
|
filename: "omnia.vendor.css",
|
|
10
10
|
});
|
|
@@ -70,7 +70,7 @@ $.webpack({
|
|
|
70
70
|
}
|
|
71
71
|
},
|
|
72
72
|
plugins: [
|
|
73
|
-
new $.webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /ignore/),
|
|
73
|
+
new $.webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /ignore/), // we will load moment localize from cdn/localize
|
|
74
74
|
extractCSS,
|
|
75
75
|
new $.omniaWebpackPlugins.NamedModulesPlugin(),
|
|
76
76
|
new $.omniaWebpackPlugins.ModifyContent([
|
|
@@ -118,7 +118,7 @@ $.webpack({
|
|
|
118
118
|
var manifestPath = $.path.resolve(__dirname, "../config/omnia.shared.vendor.manifest.json");
|
|
119
119
|
var manifestJson = require(manifestPath);
|
|
120
120
|
manifestJson.content["./node_modules/webpack/buildin/module.js"] = undefined;
|
|
121
|
-
|
|
121
|
+
fsExtra.writeFileSync(manifestPath, JSON.stringify(manifestJson));
|
|
122
122
|
$.tooling.log('omnia shared vendor generated');
|
|
123
123
|
}
|
|
124
124
|
});
|
|
@@ -173,8 +173,10 @@ $.webpack({
|
|
|
173
173
|
},
|
|
174
174
|
entry: {
|
|
175
175
|
vendor: [
|
|
176
|
-
"
|
|
177
|
-
"
|
|
176
|
+
"@stylexjs/stylex",
|
|
177
|
+
// "tslib",
|
|
178
|
+
"./client/fx/vue/VueBundler.ts",
|
|
179
|
+
"lodash.isequal",
|
|
178
180
|
"typestyle",
|
|
179
181
|
"csx",
|
|
180
182
|
"zepto-webpack",
|
|
@@ -186,15 +188,17 @@ $.webpack({
|
|
|
186
188
|
'dayjs/plugin/duration',
|
|
187
189
|
'dayjs/plugin/relativeTime',
|
|
188
190
|
"dayjs/locale/da.js",
|
|
189
|
-
"dayjs/locale/pl.js",
|
|
190
|
-
"dayjs/locale/fr.js",
|
|
191
191
|
"dayjs/locale/de.js",
|
|
192
192
|
"dayjs/locale/et.js",
|
|
193
|
-
"dayjs/locale/
|
|
193
|
+
"dayjs/locale/fr.js",
|
|
194
194
|
"dayjs/locale/lt.js",
|
|
195
|
+
"dayjs/locale/lv.js",
|
|
196
|
+
"dayjs/locale/pl.js",
|
|
195
197
|
"dayjs/locale/sv.js",
|
|
196
198
|
"dayjs/locale/nb.js",
|
|
197
199
|
"dayjs/locale/fi.js",
|
|
200
|
+
"dayjs/locale/es.js",
|
|
201
|
+
"dayjs/locale/nl.js",
|
|
198
202
|
"./wwwroot/scripts/zepto.extras.js",
|
|
199
203
|
// "@material/material-color-utilities"
|
|
200
204
|
]
|
|
@@ -208,7 +212,7 @@ $.webpack({
|
|
|
208
212
|
}
|
|
209
213
|
},
|
|
210
214
|
plugins: [
|
|
211
|
-
new $.webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /ignore/),
|
|
215
|
+
new $.webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /ignore/), // we will load moment localize from cdn/localize
|
|
212
216
|
extractCSS,
|
|
213
217
|
new $.omniaWebpackPlugins.NamedModulesPlugin(),
|
|
214
218
|
new $.omniaWebpackPlugins.ModifyContent([
|
|
@@ -270,7 +274,7 @@ return key;
|
|
|
270
274
|
var manifestPath = $.path.resolve(__dirname, "../config/omnia.vendor.manifest.json");
|
|
271
275
|
var manifestJson = require(manifestPath);
|
|
272
276
|
manifestJson.content["./node_modules/webpack/buildin/module.js"] = undefined;
|
|
273
|
-
|
|
277
|
+
fsExtra.writeFileSync(manifestPath, JSON.stringify(manifestJson));
|
|
274
278
|
$.tooling.log('omnia vendor devlopment generated');
|
|
275
279
|
}
|
|
276
280
|
});
|
|
@@ -325,8 +329,10 @@ $.webpack({
|
|
|
325
329
|
},
|
|
326
330
|
entry: {
|
|
327
331
|
vendor: [
|
|
328
|
-
"
|
|
329
|
-
"
|
|
332
|
+
"@stylexjs/stylex",
|
|
333
|
+
// "tslib",
|
|
334
|
+
"./client/fx/vue/VueBundler.ts",
|
|
335
|
+
"lodash.isequal",
|
|
330
336
|
"typestyle",
|
|
331
337
|
"csx",
|
|
332
338
|
"zepto-webpack",
|
|
@@ -358,7 +364,7 @@ $.webpack({
|
|
|
358
364
|
}
|
|
359
365
|
},
|
|
360
366
|
plugins: [
|
|
361
|
-
new $.webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /ignore/),
|
|
367
|
+
new $.webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /ignore/), // we will load moment localize from cdn/localize
|
|
362
368
|
extractCSS,
|
|
363
369
|
new $.omniaWebpackPlugins.NamedModulesPlugin(),
|
|
364
370
|
new $.omniaWebpackPlugins.ModifyContent([
|
|
@@ -420,7 +426,7 @@ return key;
|
|
|
420
426
|
var manifestPath = $.path.resolve(__dirname, "../config/omnia.vendor.manifest.json");
|
|
421
427
|
var manifestJson = require(manifestPath);
|
|
422
428
|
manifestJson.content["./node_modules/webpack/buildin/module.js"] = undefined;
|
|
423
|
-
|
|
429
|
+
fsExtra.writeFileSync(manifestPath, JSON.stringify(manifestJson));
|
|
424
430
|
$.tooling.log('omnia vendor prod generated');
|
|
425
431
|
}
|
|
426
432
|
});
|
|
@@ -492,7 +498,7 @@ $.webpack({
|
|
|
492
498
|
}
|
|
493
499
|
},
|
|
494
500
|
plugins: [
|
|
495
|
-
new $.webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /ignore/),
|
|
501
|
+
new $.webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /ignore/), // we will load moment localize from cdn/localize
|
|
496
502
|
extractCSS,
|
|
497
503
|
new $.omniaWebpackPlugins.NamedModulesPlugin(),
|
|
498
504
|
new $.omniaWebpackPlugins.ModifyContent([
|
|
@@ -540,7 +546,7 @@ $.webpack({
|
|
|
540
546
|
var manifestPath = $.path.resolve(__dirname, "../config/omnia.worker.vendor.manifest.json");
|
|
541
547
|
var manifestJson = require(manifestPath);
|
|
542
548
|
manifestJson.content["./node_modules/webpack/buildin/module.js"] = undefined;
|
|
543
|
-
|
|
549
|
+
fsExtra.writeFileSync(manifestPath, JSON.stringify(manifestJson));
|
|
544
550
|
$.tooling.log('omnia worker vendor generated');
|
|
545
551
|
}
|
|
546
552
|
});
|
|
@@ -11,6 +11,7 @@ const manifest_1 = require("./manifest");
|
|
|
11
11
|
const vueJsx_1 = require("./vueJsx");
|
|
12
12
|
const $ = tslib_1.__importStar(require("../../variables"));
|
|
13
13
|
const shared_1 = require("../../shared");
|
|
14
|
+
const doc_1 = require("../../tasks/doc");
|
|
14
15
|
let fileGraphs = {};
|
|
15
16
|
let manifests = {};
|
|
16
17
|
const initialManifests = [
|
|
@@ -152,7 +153,7 @@ async function buildFileGraph(unknownId, code) {
|
|
|
152
153
|
return { fileGraph, code };
|
|
153
154
|
}
|
|
154
155
|
fileGraph.js.scanned = true;
|
|
155
|
-
code = (0, shared_1.
|
|
156
|
+
code = (0, shared_1.transformDefineVueComponent)(code, fileGraph.id);
|
|
156
157
|
const esbuildTransformResult = await (0, vite_1.transformWithEsbuild)(code, id, esbuildTransformOptions);
|
|
157
158
|
code = esbuildTransformResult.code;
|
|
158
159
|
// d.ts or interface only
|
|
@@ -165,6 +166,7 @@ async function buildFileGraph(unknownId, code) {
|
|
|
165
166
|
}
|
|
166
167
|
fileGraph.js.metadata = utils_1.moduleAnalysis.analyze(code, id);
|
|
167
168
|
ensureDependencies(id, fileGraph.js.metadata);
|
|
169
|
+
code = (0, doc_1.importSnippetCode)(code, fileGraph.id);
|
|
168
170
|
return { fileGraph, code, esbuildTransformResult };
|
|
169
171
|
}
|
|
170
172
|
exports.buildFileGraph = buildFileGraph;
|
|
@@ -14,8 +14,9 @@ function transformVueJsx(code, id) {
|
|
|
14
14
|
$.isExtensionEnv ?
|
|
15
15
|
'./node_modules/@omnia/tooling-vue/internal-do-not-import-from-here/babel/preset-jsx.js'
|
|
16
16
|
: './client/tooling/vue/babel/preset-jsx.ts'
|
|
17
|
-
]
|
|
18
|
-
]
|
|
17
|
+
],
|
|
18
|
+
],
|
|
19
|
+
plugins: []
|
|
19
20
|
});
|
|
20
21
|
// check for hmr injection
|
|
21
22
|
const declaredComponents = [];
|
|
@@ -20,7 +20,7 @@ function omniaPlugin(options) {
|
|
|
20
20
|
'vue': 'vue/dist/vue.runtime.esm-bundler.js',
|
|
21
21
|
// 'vue-class-component': 'vue-class-component/dist/vue-class-component.esm.js',
|
|
22
22
|
// 'vue-property-decorator': 'vue-property-decorator/lib/vue-property-decorator.js',
|
|
23
|
-
'vue-virtual-scroller': 'vue-virtual-scroller/dist/vue-virtual-scroller.esm.js',
|
|
23
|
+
// 'vue-virtual-scroller': 'vue-virtual-scroller/dist/vue-virtual-scroller.esm.js',
|
|
24
24
|
'typestyle': 'typestyle/lib.es2015/index.js',
|
|
25
25
|
'dayjs': 'dayjs/dayjs.min.js',
|
|
26
26
|
// '@tiptap/core': '@tiptap/core/dist/index.js',
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (content: any, context: any): any;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const tslib_1 = require("tslib");
|
|
4
|
+
const path_1 = tslib_1.__importDefault(require("path"));
|
|
5
|
+
const doc_1 = require("../tasks/doc");
|
|
6
|
+
function default_1(content, context) {
|
|
7
|
+
const filePath = "./" + path_1.default.relative(process.cwd(), this.resourcePath).replace(/\\/g, "/");
|
|
8
|
+
content = (0, doc_1.importSnippetCode)(content, filePath);
|
|
9
|
+
return content;
|
|
10
|
+
}
|
|
11
|
+
exports.default = default_1;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (content: string, context: any): string;
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
export default function (): {
|
|
2
2
|
test: RegExp;
|
|
3
|
-
use: {
|
|
3
|
+
use: ({
|
|
4
|
+
loader: any;
|
|
5
|
+
options?: undefined;
|
|
6
|
+
} | {
|
|
4
7
|
loader: string;
|
|
5
8
|
options: {
|
|
6
9
|
loader: string;
|
|
@@ -13,5 +16,5 @@ export default function (): {
|
|
|
13
16
|
};
|
|
14
17
|
};
|
|
15
18
|
};
|
|
16
|
-
}[];
|
|
19
|
+
})[];
|
|
17
20
|
}[];
|
|
@@ -1,10 +1,15 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const tslib_1 = require("tslib");
|
|
4
|
+
const $ = tslib_1.__importStar(require("../variables"));
|
|
3
5
|
var path = require('path');
|
|
4
6
|
function default_1() {
|
|
5
7
|
return [{
|
|
6
8
|
test: /\.ts$/,
|
|
7
9
|
use: [
|
|
10
|
+
{
|
|
11
|
+
loader: path.resolve(__dirname, $.isExtensionEnv ? './esbuild-custom-loader.js' : './esbuild-custom-loader.ts'),
|
|
12
|
+
},
|
|
8
13
|
{
|
|
9
14
|
loader: 'esbuild-loader',
|
|
10
15
|
options: {
|
|
@@ -18,6 +23,9 @@ function default_1() {
|
|
|
18
23
|
}
|
|
19
24
|
}
|
|
20
25
|
},
|
|
26
|
+
},
|
|
27
|
+
{
|
|
28
|
+
loader: path.resolve(__dirname, $.isExtensionEnv ? './doc-loader.js' : './doc-loader.ts'),
|
|
21
29
|
}
|
|
22
30
|
]
|
|
23
31
|
}];
|
|
@@ -8,6 +8,9 @@ export default function (): {
|
|
|
8
8
|
plugins: any[];
|
|
9
9
|
presets: string[][];
|
|
10
10
|
};
|
|
11
|
+
} | {
|
|
12
|
+
loader: any;
|
|
13
|
+
options?: undefined;
|
|
11
14
|
} | {
|
|
12
15
|
loader: string;
|
|
13
16
|
options: {
|
|
@@ -22,8 +25,5 @@ export default function (): {
|
|
|
22
25
|
};
|
|
23
26
|
};
|
|
24
27
|
};
|
|
25
|
-
} | {
|
|
26
|
-
loader: any;
|
|
27
|
-
options?: undefined;
|
|
28
28
|
})[];
|
|
29
29
|
}[];
|
|
@@ -47,6 +47,12 @@ function default_1() {
|
|
|
47
47
|
// }
|
|
48
48
|
// }
|
|
49
49
|
// },
|
|
50
|
+
{
|
|
51
|
+
loader: path.resolve(__dirname, $.isExtensionEnv ? './esbuild-custom-loader.js' : './esbuild-custom-loader.ts'),
|
|
52
|
+
},
|
|
53
|
+
{
|
|
54
|
+
loader: path.resolve(__dirname, $.isExtensionEnv ? './vue-component-loader.js' : './vue-component-loader.ts'),
|
|
55
|
+
},
|
|
50
56
|
{
|
|
51
57
|
loader: 'esbuild-loader',
|
|
52
58
|
options: {
|
|
@@ -62,9 +68,9 @@ function default_1() {
|
|
|
62
68
|
}
|
|
63
69
|
},
|
|
64
70
|
},
|
|
65
|
-
{
|
|
66
|
-
|
|
67
|
-
}
|
|
71
|
+
// {
|
|
72
|
+
// loader: path.resolve(__dirname, $.isExtensionEnv ? './vue-component-loader.js' : './vue-component-loader.ts'),
|
|
73
|
+
// }
|
|
68
74
|
];
|
|
69
75
|
return [
|
|
70
76
|
{
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (content: any, context: any): any;
|
package/internal-do-not-import-from-here/webpack-loaders/{wc-loader.js → vue-component-loader.js}
RENAMED
|
@@ -4,6 +4,8 @@ const tslib_1 = require("tslib");
|
|
|
4
4
|
const path_1 = tslib_1.__importDefault(require("path"));
|
|
5
5
|
const shared_1 = require("../shared");
|
|
6
6
|
function default_1(content, context) {
|
|
7
|
-
|
|
7
|
+
const filePath = "./" + path_1.default.relative(process.cwd(), this.resourcePath).replace(/\\/g, "/");
|
|
8
|
+
content = (0, shared_1.transformDefineVueComponent)(content, filePath);
|
|
9
|
+
return content;
|
|
8
10
|
}
|
|
9
11
|
exports.default = default_1;
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the MIT license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*
|
|
7
|
+
*
|
|
8
|
+
*/
|
|
9
|
+
type PluginOptions = {
|
|
10
|
+
dev?: boolean;
|
|
11
|
+
stylexImports?: string[];
|
|
12
|
+
babelConfig?: {
|
|
13
|
+
plugins?: any;
|
|
14
|
+
presets?: any;
|
|
15
|
+
babelrc?: boolean;
|
|
16
|
+
};
|
|
17
|
+
filename?: string;
|
|
18
|
+
appendTo?: string;
|
|
19
|
+
useCSSLayers?: boolean;
|
|
20
|
+
runtimeInjection?: boolean;
|
|
21
|
+
classNamePrefix?: string;
|
|
22
|
+
unstable_moduleResolution?: any;
|
|
23
|
+
};
|
|
24
|
+
export declare class StylexPlugin {
|
|
25
|
+
stylexRules: {};
|
|
26
|
+
filesInLastRun: any;
|
|
27
|
+
dev: boolean;
|
|
28
|
+
appendTo: any;
|
|
29
|
+
filename: string;
|
|
30
|
+
stylexImports: string[];
|
|
31
|
+
unstable_moduleResolution: {
|
|
32
|
+
type: string;
|
|
33
|
+
rootDir: string;
|
|
34
|
+
};
|
|
35
|
+
babelConfig: {
|
|
36
|
+
plugins: any[];
|
|
37
|
+
presets: any[];
|
|
38
|
+
babelrc: boolean;
|
|
39
|
+
};
|
|
40
|
+
useCSSLayers: boolean;
|
|
41
|
+
defaultOptions: PluginOptions;
|
|
42
|
+
babelPlugin: any;
|
|
43
|
+
constructor(options?: PluginOptions);
|
|
44
|
+
apply(compiler: any): void;
|
|
45
|
+
transformCode(inputCode: string, filename: any, logger: any): Promise<{
|
|
46
|
+
code: any;
|
|
47
|
+
map: any;
|
|
48
|
+
} | {
|
|
49
|
+
code: string;
|
|
50
|
+
map?: undefined;
|
|
51
|
+
}>;
|
|
52
|
+
}
|
|
53
|
+
export {};
|
|
@@ -0,0 +1,194 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
/**
|
|
3
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
4
|
+
*
|
|
5
|
+
* This source code is licensed under the MIT license found in the
|
|
6
|
+
* LICENSE file in the root directory of this source tree.
|
|
7
|
+
*
|
|
8
|
+
*
|
|
9
|
+
*/
|
|
10
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
11
|
+
exports.StylexPlugin = void 0;
|
|
12
|
+
const tslib_1 = require("tslib");
|
|
13
|
+
const core_1 = require("@babel/core");
|
|
14
|
+
const path_1 = tslib_1.__importDefault(require("path"));
|
|
15
|
+
const babel_plugin_1 = tslib_1.__importDefault(require("@stylexjs/babel-plugin"));
|
|
16
|
+
const webpack_1 = tslib_1.__importDefault(require("webpack"));
|
|
17
|
+
// import * as flowSyntaxPlugin from '@babel/plugin-syntax-flow';
|
|
18
|
+
// import * as jsxSyntaxPlugin from '@babel/plugin-syntax-jsx';
|
|
19
|
+
// import * as typescriptSyntaxPlugin from '@babel/plugin-syntax-typescript';
|
|
20
|
+
const promises_1 = tslib_1.__importDefault(require("fs/promises"));
|
|
21
|
+
const $ = tslib_1.__importStar(require("../../variables"));
|
|
22
|
+
const { NormalModule, Compilation } = webpack_1.default;
|
|
23
|
+
const PLUGIN_NAME = 'stylex';
|
|
24
|
+
const IS_DEV_ENV = process.env.NODE_ENV === 'development' ||
|
|
25
|
+
process.env.BABEL_ENV === 'development';
|
|
26
|
+
const { RawSource, ConcatSource } = webpack_1.default.sources;
|
|
27
|
+
class StylexPlugin {
|
|
28
|
+
constructor(options = {}) {
|
|
29
|
+
this.stylexRules = {};
|
|
30
|
+
this.filesInLastRun = null;
|
|
31
|
+
this.dev = IS_DEV_ENV;
|
|
32
|
+
this.appendTo = null;
|
|
33
|
+
this.filename = "stylex.css";
|
|
34
|
+
this.stylexImports = ['stylex', '@stylexjs/stylex'];
|
|
35
|
+
this.unstable_moduleResolution = { type: 'commonJS', rootDir: process.cwd() };
|
|
36
|
+
this.babelConfig = { plugins: [], presets: [], babelrc: false };
|
|
37
|
+
this.useCSSLayers = false;
|
|
38
|
+
this.defaultOptions = {
|
|
39
|
+
dev: IS_DEV_ENV,
|
|
40
|
+
appendTo: null,
|
|
41
|
+
filename: "stylex.css",
|
|
42
|
+
stylexImports: ['stylex', '@stylexjs/stylex'],
|
|
43
|
+
unstable_moduleResolution: { type: 'commonJS', rootDir: process.cwd() },
|
|
44
|
+
babelConfig: { plugins: [], presets: [], babelrc: false },
|
|
45
|
+
useCSSLayers: false
|
|
46
|
+
};
|
|
47
|
+
Object.assign(this, this.defaultOptions, options);
|
|
48
|
+
this.babelPlugin = [
|
|
49
|
+
babel_plugin_1.default,
|
|
50
|
+
{
|
|
51
|
+
dev: this.dev,
|
|
52
|
+
unstable_moduleResolution: this.unstable_moduleResolution,
|
|
53
|
+
importSources: this.stylexImports,
|
|
54
|
+
...options,
|
|
55
|
+
},
|
|
56
|
+
];
|
|
57
|
+
}
|
|
58
|
+
apply(compiler) {
|
|
59
|
+
compiler.hooks.make.tap(PLUGIN_NAME, (compilation) => {
|
|
60
|
+
// Apply loader to JS modules.
|
|
61
|
+
NormalModule.getCompilationHooks(compilation).loader.tap(PLUGIN_NAME, (loaderContext, module) => {
|
|
62
|
+
if (
|
|
63
|
+
// .js, .jsx, .mjs, .cjs, .ts, .tsx, .mts, .cts
|
|
64
|
+
/\.ts[x]?$/.test(path_1.default.extname(module.resource))) {
|
|
65
|
+
// It might make sense to use .push() here instead of .unshift()
|
|
66
|
+
// Webpack usually runs loaders in reverse order and we want to ideally run
|
|
67
|
+
// our loader before anything else.
|
|
68
|
+
module.loaders.unshift({
|
|
69
|
+
loader: path_1.default.resolve(__dirname, $.isExtensionEnv ? 'loader.js' : 'loader.ts'),
|
|
70
|
+
options: { stylexPlugin: this },
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
});
|
|
74
|
+
// Make a list of all modules that were included in the last compilation.
|
|
75
|
+
// This might need to be tweaked if not all files are included after a change
|
|
76
|
+
compilation.hooks.finishModules.tap(PLUGIN_NAME, (modules) => {
|
|
77
|
+
this.filesInLastRun = [...modules.values()].map((m) => m.resource);
|
|
78
|
+
});
|
|
79
|
+
const getStyleXRules = () => {
|
|
80
|
+
const { stylexRules } = this;
|
|
81
|
+
if (Object.keys(stylexRules).length === 0) {
|
|
82
|
+
return null;
|
|
83
|
+
}
|
|
84
|
+
// Take styles for the modules that were included in the last compilation.
|
|
85
|
+
const allRules = Object.keys(stylexRules)
|
|
86
|
+
.filter((filename) => this.filesInLastRun == null
|
|
87
|
+
? true
|
|
88
|
+
: this.filesInLastRun.includes(filename))
|
|
89
|
+
.map((filename) => stylexRules[filename])
|
|
90
|
+
.flat();
|
|
91
|
+
return babel_plugin_1.default.processStylexRules(allRules, this.useCSSLayers);
|
|
92
|
+
};
|
|
93
|
+
if (this.appendTo) {
|
|
94
|
+
compilation.hooks.processAssets.tap({
|
|
95
|
+
name: PLUGIN_NAME,
|
|
96
|
+
stage: Compilation.PROCESS_ASSETS_STAGE_PRE_PROCESS, // see below for more stages
|
|
97
|
+
}, (assets) => {
|
|
98
|
+
const cssFileName = Object.keys(assets).find(typeof this.appendTo === 'function'
|
|
99
|
+
? this.appendTo
|
|
100
|
+
: (filename) => filename.endsWith(this.appendTo));
|
|
101
|
+
if (cssFileName) {
|
|
102
|
+
const cssAsset = assets[cssFileName];
|
|
103
|
+
const stylexCSS = getStyleXRules();
|
|
104
|
+
if (stylexCSS != null) {
|
|
105
|
+
assets[cssFileName] = new ConcatSource(cssAsset, new RawSource(stylexCSS));
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
});
|
|
109
|
+
}
|
|
110
|
+
else {
|
|
111
|
+
// We'll emit an asset ourselves. This comes with some complications in from Webpack.
|
|
112
|
+
// If the filename contains replacement tokens, like [contenthash], we need to
|
|
113
|
+
// process those tokens ourselves. Webpack does provide a way to reuse the configured
|
|
114
|
+
// hashing functions. We'll take advantage of that to process tokens.
|
|
115
|
+
const getContentHash = (source) => {
|
|
116
|
+
const { outputOptions } = compilation;
|
|
117
|
+
const { hashDigest, hashDigestLength, hashFunction, hashSalt } = outputOptions;
|
|
118
|
+
const hash = compiler.webpack.util.createHash(hashFunction);
|
|
119
|
+
if (hashSalt) {
|
|
120
|
+
hash.update(hashSalt);
|
|
121
|
+
}
|
|
122
|
+
hash.update(source);
|
|
123
|
+
const fullContentHash = hash.digest(hashDigest);
|
|
124
|
+
return fullContentHash.toString().slice(0, hashDigestLength);
|
|
125
|
+
};
|
|
126
|
+
// Consume collected rules and emit the stylex CSS asset
|
|
127
|
+
compilation.hooks.processAssets.tap({
|
|
128
|
+
name: PLUGIN_NAME,
|
|
129
|
+
stage: Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL,
|
|
130
|
+
}, () => {
|
|
131
|
+
try {
|
|
132
|
+
const collectedCSS = getStyleXRules();
|
|
133
|
+
if (collectedCSS) {
|
|
134
|
+
// build up a content hash for the rules using webpack's configured hashing functions
|
|
135
|
+
const contentHash = getContentHash(collectedCSS);
|
|
136
|
+
// pretend to be a chunk so we can reuse the webpack routine to process the filename and do token replacement
|
|
137
|
+
// see https://github.com/webpack/webpack/blob/main/lib/Compilation.js#L4733
|
|
138
|
+
// see https://github.com/webpack/webpack/blob/main/lib/TemplatedPathPlugin.js#L102
|
|
139
|
+
const data = {
|
|
140
|
+
filename: this.filename,
|
|
141
|
+
contentHash: contentHash,
|
|
142
|
+
chunk: {
|
|
143
|
+
id: this.filename,
|
|
144
|
+
name: path_1.default.parse(this.filename).name,
|
|
145
|
+
hash: contentHash,
|
|
146
|
+
},
|
|
147
|
+
};
|
|
148
|
+
const { path: hashedPath, info: assetsInfo } = compilation.getPathWithInfo(data.filename, data);
|
|
149
|
+
compilation.emitAsset(hashedPath, new RawSource(collectedCSS), assetsInfo);
|
|
150
|
+
}
|
|
151
|
+
}
|
|
152
|
+
catch (e) {
|
|
153
|
+
compilation.errors.push(e);
|
|
154
|
+
}
|
|
155
|
+
});
|
|
156
|
+
}
|
|
157
|
+
});
|
|
158
|
+
}
|
|
159
|
+
// This function is not called by Webpack directly.
|
|
160
|
+
// Instead, `NormalModule.getCompilationHooks` is used to inject a loader
|
|
161
|
+
// for JS modules. The loader than calls this function.
|
|
162
|
+
async transformCode(inputCode, filename, logger) {
|
|
163
|
+
if (this.stylexImports.some((importName) => inputCode.includes(importName))) {
|
|
164
|
+
const originalSource = this.babelConfig.babelrc
|
|
165
|
+
? await promises_1.default.readFile(filename, 'utf8')
|
|
166
|
+
: inputCode;
|
|
167
|
+
const { code, map, metadata } = await (0, core_1.transformAsync)(originalSource, {
|
|
168
|
+
babelrc: this.babelConfig.babelrc,
|
|
169
|
+
filename,
|
|
170
|
+
// Use TypeScript syntax plugin if the filename ends with `.ts` or `.tsx`
|
|
171
|
+
// and use the Flow syntax plugin otherwise.
|
|
172
|
+
plugins: [
|
|
173
|
+
// ...this.babelConfig.plugins,
|
|
174
|
+
// path.extname(filename) === '.ts'
|
|
175
|
+
// ? typescriptSyntaxPlugin
|
|
176
|
+
// : path.extname(filename) === '.tsx'
|
|
177
|
+
// ? [typescriptSyntaxPlugin, { isTSX: true }]
|
|
178
|
+
// : flowSyntaxPlugin,
|
|
179
|
+
// jsxSyntaxPlugin,
|
|
180
|
+
this.babelPlugin,
|
|
181
|
+
],
|
|
182
|
+
presets: this.babelConfig.presets,
|
|
183
|
+
});
|
|
184
|
+
if (metadata.stylex != null && metadata.stylex.length > 0) {
|
|
185
|
+
this.stylexRules[filename] = metadata.stylex;
|
|
186
|
+
}
|
|
187
|
+
if (!this.babelConfig.babelrc) {
|
|
188
|
+
return { code, map };
|
|
189
|
+
}
|
|
190
|
+
}
|
|
191
|
+
return { code: inputCode };
|
|
192
|
+
}
|
|
193
|
+
}
|
|
194
|
+
exports.StylexPlugin = StylexPlugin;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the MIT license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*
|
|
7
|
+
*
|
|
8
|
+
*/
|
|
9
|
+
export default function stylexLoader(inputCode: any): void;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the MIT license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*
|
|
7
|
+
*
|
|
8
|
+
*/
|
|
9
|
+
'use strict';
|
|
10
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
11
|
+
const PLUGIN_NAME = 'stylex';
|
|
12
|
+
function stylexLoader(inputCode) {
|
|
13
|
+
const callback = this.async();
|
|
14
|
+
const { stylexPlugin } = this.getOptions();
|
|
15
|
+
const logger = this._compiler.getInfrastructureLogger(PLUGIN_NAME);
|
|
16
|
+
stylexPlugin.transformCode(inputCode, this.resourcePath, logger).then(({ code, map }) => {
|
|
17
|
+
callback(null, code, map);
|
|
18
|
+
}, (error) => {
|
|
19
|
+
callback(error);
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
exports.default = stylexLoader;
|
|
23
|
+
;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@omnia/tooling-vue",
|
|
3
3
|
"license": "MIT",
|
|
4
|
-
"version": "8.0.
|
|
4
|
+
"version": "8.0.108-dev",
|
|
5
5
|
"description": "Used to bundle and serve manifests web component that build on Vue framework.",
|
|
6
6
|
"scripts": {
|
|
7
7
|
"test": "echo \"Error: no test specified\" && exit 1"
|
|
@@ -19,12 +19,12 @@
|
|
|
19
19
|
],
|
|
20
20
|
"author": "Precio Fishbone",
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@omnia/fx-models": "8.0.
|
|
23
|
-
"@omnia/tooling-composers": "8.0.
|
|
22
|
+
"@omnia/fx-models": "8.0.108-dev",
|
|
23
|
+
"@omnia/tooling-composers": "8.0.108-dev",
|
|
24
24
|
"@types/mousetrap": "1.5.34",
|
|
25
25
|
"@types/quill": "1.3.6",
|
|
26
26
|
"@types/zepto": "1.0.29",
|
|
27
|
-
"@babel/core": "7.
|
|
27
|
+
"@babel/core": "7.23.7",
|
|
28
28
|
"babel-loader": "8.3.0",
|
|
29
29
|
"@vue/babel-plugin-jsx": "1.1.1",
|
|
30
30
|
"circular-dependency-plugin": "5.2.2",
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
"console-timestamp": "0.3.0",
|
|
33
33
|
"css-loader": "5.0.1",
|
|
34
34
|
"file-loader": "6.2.0",
|
|
35
|
-
"
|
|
35
|
+
"json-parse-better-errors": "1.0.2",
|
|
36
36
|
"terser": "5.17.1",
|
|
37
37
|
"less-loader": "10.2.0",
|
|
38
38
|
"mini-css-extract-plugin": "1.3.3",
|
|
@@ -45,7 +45,7 @@
|
|
|
45
45
|
"prettier": "1.17.0",
|
|
46
46
|
"typestyle": "2.4.0",
|
|
47
47
|
"url-loader": "4.1.1",
|
|
48
|
-
"webpack": "5.
|
|
48
|
+
"webpack": "5.89.0",
|
|
49
49
|
"webpack-core": "0.6.9",
|
|
50
50
|
"webpack-dev-middleware": "5.3.1",
|
|
51
51
|
"webpack-merge": "5.8.0",
|
|
@@ -56,11 +56,11 @@
|
|
|
56
56
|
"es6-promise": "4.2.4",
|
|
57
57
|
"hash-sum": "1.0.2",
|
|
58
58
|
"lodash": "4.17.21",
|
|
59
|
-
"vite": "
|
|
60
|
-
"vite-plugin-inspect": "0.
|
|
59
|
+
"vite": "5.0.10",
|
|
60
|
+
"vite-plugin-inspect": "0.8.1",
|
|
61
61
|
"appdata-path": "1.0.0",
|
|
62
|
-
"
|
|
63
|
-
"
|
|
62
|
+
"url": "0.11.0",
|
|
63
|
+
"@stylexjs/babel-plugin": "0.4.1"
|
|
64
64
|
},
|
|
65
65
|
"bugs": {
|
|
66
66
|
"url": "https://github.com/preciofishbone/OmniaFx/issues"
|