@omnia/tooling-vue 8.0.79-vnext → 8.0.81-vnext

package/internal-do-not-import-from-here/tasks/bundle.js

@@ -1,6 +1,6 @@
 'use strict';
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.addDependency = exports.processManifestGenerated = exports.checkDuplicateBundle = exports.registerWebComponentDefinitions = exports.registerManifestsReference = exports.createCombinedManfest = exports.createVueWebpackConfig = exports.cleanUpComposer = exports.getBuildOption = exports.getServiceId = exports.bundleManifest = exports.ensureManifestDependencyInRuntime = void 0;
+exports.addDependency = exports.processManifestGenerated = exports.checkDuplicateBundle = exports.registerManifestsReference = exports.createCombinedManfest = exports.createVueWebpackConfig = exports.cleanUpComposer = exports.getBuildOption = exports.getServiceId = exports.bundleManifest = exports.ensureManifestDependencyInRuntime = void 0;
 const tslib_1 = require("tslib");
 const path_1 = tslib_1.__importDefault(require("path"));
 const del_1 = tslib_1.__importDefault(require("del"));
@@ -20,7 +20,7 @@ const ConcatSource = require('webpack-core/lib/ConcatSource');
 const CircularDependencyPlugin = require('circular-dependency-plugin');
 const isEqual = require('lodash/isEqual');
 const vendorProdId = "aaf89b2d-5ea8-4b79-946a-8c1e89f713a3";
-let outDirManifestMetadata = "client/tooling/vue/output_manifests", _manifestsEntry = {}, _registeredReferenceManifests = [], serviceId = null, _modulesStats = {}, _manifestsStats = {}, keepTrackbuildOptions = {}, _transformResourcepaths = [], _wcDefinitions = {};
+let outDirManifestMetadata = "client/tooling/vue/output_manifests", _manifestsEntry = {}, _registeredReferenceManifests = [], serviceId = null, _modulesStats = {}, _manifestsStats = {}, keepTrackbuildOptions = {}, _transformResourcepaths = [];
 if ($.isExtensionEnv) {
     outDirManifestMetadata = "node_modules/@omnia/tooling-vue/internal-do-not-import-from-here/output_manifests";
 }
@@ -186,12 +186,7 @@ function clean() {
     return new Promise(function (resolve, reject) {
         del_1.default.sync("node_modules/.cache");
         del_1.default.sync($.tooling.utils.root(outDirManifestMetadata + "/manifest.entries.cached.json"));
-        if ($.isExtensionEnv) {
-            del_1.default.sync($.path.resolve(__dirname, "../wctypings.ts"));
-        }
-        else {
-            del_1.default.sync($.path.resolve(__dirname, `../bb000000-0000-bbbb-0000-0000000000bb.wctypings.ts`));
-        }
+        shared_1.ConfigurationManager.webComponentTypings.delete();
         resolve();
     });
 }
@@ -417,56 +412,55 @@ async function generateComponentTypingsAndDoc(componentRegistrations) {
             throw new Error("Exit, have an exception.");
         }
     }
-    let wcTypingsPath = "", docPath = $.path.resolve(__dirname, "ComponentDocRegistrations.ts");
+    let docPath = $.path.resolve(__dirname, "ComponentDocRegistrations.ts");
     ;
-    if ($.isExtensionEnv) {
-        wcTypingsPath = $.path.resolve(__dirname, "../wctypings.ts");
-    }
-    else {
-        wcTypingsPath = $.path.resolve(__dirname, `../${getServiceId().toLowerCase()}.wctypings.ts`);
-    }
-    let wcTypings = $.isExtensionEnv ? `
+    const wcNamespace = getBuildOption()?.webComponentNamespace;
+    const info = shared_1.ConfigurationManager.outputInfo.get();
+    info.wc = {
+        namespace: wcNamespace,
+        mappings: {}
+    };
+    let wcTypings = wcNamespace ? `
 //{{importWC}}
 declare global {
-namespace JSX {
-interface Element { }
-interface ElementClass { }
+    namespace JSX {
+        interface Element { }
+        interface ElementClass { }
 
-interface IntrinsicElements {
-    //{{elementName}}
-}
+        interface IntrinsicElements {
+            //{{elementName}}
+        }
+    }
 }
+
+declare global {
+    let ${wcNamespace}: {
+        //{{nselementName}}
+    };
 }
 `
         : `
 //{{importWC}}
-declare global {
-namespace JSX {
-interface Element { }
-interface ElementClass { }
+    declare global {
+    namespace JSX {
+        interface Element { }
+        interface ElementClass { }
 
-interface IntrinsicElements {
-    //{{elementName}}
-}
-}
-}
-
-declare global {
-    let omfx: {
-        //{{omfxelementName}}
-	};
-}
-`;
+        interface IntrinsicElements {
+            //{{elementName}}
+        }
+    }
+}`;
     if ($.isExtensionEnv) {
         wcTypings = `import { VueComponentBaseProps } from "@omnia/fx/ux";
         ${wcTypings}`;
     }
     else {
-        wcTypings = `import { VueComponentBaseProps } from "../../../client/fx/ux/index";
+        wcTypings = `import { VueComponentBaseProps } from "../../../../client/fx/ux/index";
         ${wcTypings}`;
     }
     await tooling_1.utils.asyncForEach(componentRegistrations, async (wc) => {
-        wcTypings = generateWebComponentTypings(wc, wcTypings);
+        wcTypings = generateWebComponentTypings(wc, wcTypings, info);
         await buildDoc(wc);
     });
     if (Object.keys(docResult).length > 0) {
@@ -487,7 +481,7 @@ extendApi(api => api.fx.docs.registrations, api => {
         $.composers.ManifestRegistry.setCurrentManifestPath(`${path_1.default.relative(tooling_1.utils.root(""), path_1.default.resolve(__dirname))}/`);
         $.composers
             .Composer
-            .registerManifest(getBuildOption().dynamicDocManifestId || new fx_models_1.Guid(`${tooling_1.utils.generateGuid()}`), "omnia.fx.docs.components.registraions")
+            .registerManifest(getBuildOption().docResourceManifestId || new fx_models_1.Guid(`${tooling_1.utils.generateGuid()}`), "omnia.fx.docs.components.registraions")
             .registerResources({
             resourcePaths: ["./ComponentDocRegistrations.ts"]
         })
@@ -495,7 +489,8 @@ extendApi(api => api.fx.docs.registrations, api => {
             .extendApi(api => api.fx.docs.registrations);
         $.composers.ManifestRegistry.setCurrentManifestPath();
     }
-    fsExtra.outputFileSync(wcTypingsPath, wcTypings);
+    shared_1.ConfigurationManager.webComponentTypings.update(wcTypings);
+    shared_1.ConfigurationManager.outputInfo.update(info);
     tooling_1.utils.logTime('Done - Generate components typings and documentation', startTime);
 }
 function buildManifestMetadatas(entries) {
@@ -1072,7 +1067,7 @@ function createVueWebpackConfig(currentEntry, entries, bundleOutputDir, viteHmrO
 exports.createVueWebpackConfig = createVueWebpackConfig;
 function createWebpackConfigForManifestMetadata(entry, metadataOutputDir) {
     var entensionId = getServiceId();
-    return Object.assign({}, (0, shared_1.getBaseWebpackConfigForManifestMetadata)(entry, metadataOutputDir), {
+    return Object.assign({}, getBaseWebpackConfigForManifestMetadata(entry, metadataOutputDir), {
         plugins: [
             ...buildReferenceManifestFromConfig(),
             new $.omniaWebpackPlugins.NamedModulesPlugin(buildModuleName()),
@@ -1084,6 +1079,117 @@ function createWebpackConfigForManifestMetadata(entry, metadataOutputDir) {
         ]
     });
 }
+function getBaseWebpackConfigForManifestMetadata(entry, bundleOutputDir) {
+    return {
+        devtool: false,
+        mode: 'development',
+        context: $.tooling.utils.root(""),
+        entry: entry,
+        optimization: Object.assign({
+            removeAvailableModules: false,
+            removeEmptyChunks: false,
+            splitChunks: false,
+        }),
+        resolve: {
+            modules: $.tooling.core.getWebpackResolveModules(),
+            extensions: ['.ts', '.tsx', '.mjs', '.js', '.jsx'],
+            //extensions: ['.js', '.jsx', '.ts', '.tsx', '.html', '.vue', '.less', '.styl'],
+            symlinks: false,
+            cacheWithContext: true,
+            descriptionFiles: ['package.json'],
+            alias: Object.assign({}, $.tooling.core.getWebpackResolveAlias(), ($.composers.BuildConfigurationRegistry.getBuildOptions()?.moduleOptions?.alias || {}), {
+                'axios$': 'axios/dist/axios.js',
+                'typestyle$': 'typestyle/lib.es2015/index.js',
+                'vue$': 'vue/dist/vue.runtime.esm-bundler.js',
+                '@microsoft/signalr': '@microsoft/signalr/dist/webworker/signalr.js',
+            }),
+            //mainFields: ['main', 'browser', 'module']
+        },
+        output: {
+            pathinfo: false,
+            path: $.tooling.utils.root(bundleOutputDir),
+            filename: '[name].js'
+        },
+        externals: [
+            function ({ context, request }, callback) {
+                if (request.indexOf("node_modules") > -1 || (/\.(sass|scss|styl|less|css)$/i).test(request)) {
+                    return callback(null, 'commonjs ' + request);
+                }
+                callback();
+            }
+        ],
+        module: {
+            noParse: /wwwroot(.*)/,
+            rules: [
+                {
+                    test: /\.m?js$/,
+                    resolve: {
+                        fullySpecified: false, // disable the behaviour
+                    },
+                },
+                ...(0, ts_loader_1.default)(),
+                ...(0, tsx_loader_1.default)(),
+                {
+                    test: /\.styl$/,
+                    use: [
+                        //'style-loader',
+                        //'css-loader',
+                        'stylus-loader'
+                    ]
+                },
+                ...($.isExtensionEnv ? [] : [{
+                        test: /\.s(c|a)ss$/,
+                        use: [
+                            {
+                                loader: 'sass-loader',
+                                options: {
+                                    implementation: require('sass'),
+                                    sassOptions: {
+                                        //fiber: require('fibers'),
+                                        indentedSyntax: true
+                                    }
+                                    //fiber: require('fibers')
+                                }
+                            }
+                        ]
+                    }]),
+                {
+                    test: /\.less$/,
+                    use: [
+                        //'style-loader',
+                        //'css-loader',
+                        'less-loader'
+                    ]
+                },
+                {
+                    test: /\.css$/,
+                    use: [
+                        //'style-loader',
+                        {
+                            loader: 'css-loader'
+                        }
+                    ]
+                },
+                {
+                    test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
+                    loader: 'url-loader'
+                },
+                {
+                    test: /\.(ico|gif|png|jpe?g|svg)$/i,
+                    use: [{
+                            loader: 'file-loader',
+                            options: {
+                                name: '[name].[ext]',
+                                outputPath: "../images/",
+                                publicPath: '/omnia/images/'
+                            }
+                        }]
+                    //loader: 'url-loader'
+                }
+            ]
+        }
+    };
+}
 function buildCommonChunk(entry) {
     let bundleOptions = getBuildOption().bundleOptions;
     let minChunk = bundleOptions.commonsChunk.minChunks || 2;
@@ -1846,19 +1952,13 @@ exports.registerManifestsReference = registerManifestsReference;
 function getRegisteredReferenceManifests() {
     return _registeredReferenceManifests;
 }
-function registerWebComponentDefinitions(definitions) {
-    if (definitions) {
-        _wcDefinitions = $.merge(_wcDefinitions, definitions);
-    }
-}
-exports.registerWebComponentDefinitions = registerWebComponentDefinitions;
 function sortString(a, b) {
     if (a >= b) {
         return 1;
     }
     return -1;
 }
-function generateWebComponentTypings(wc, template) {
+function generateWebComponentTypings(wc, template, info) {
     // export default defineVueWebComponent
     let wcPath = (0, shared_1.convertManifestPathToEntryPath)(wc.manifestPath, [wc.componentOptions.entryPoint])[0];
     let content = fsExtra.readFileSync(wcPath, 'utf8');
@@ -1872,18 +1972,21 @@ function generateWebComponentTypings(wc, template) {
             importPath = importPath.replace("./", "");
         }
         if ($.isExtensionEnv) {
-            importPath = `../../../../${importPath}`;
+            importPath = `../../../../../${importPath}`;
         }
         else {
-            importPath = `../../../${importPath}`;
+            importPath = `../../../../${importPath}`;
         }
+        let elementNamePascalCase = wc.componentOptions.elementName.replace("omfx-", "").replace(/-([a-z])/g, function (g) { return g[1].toUpperCase(); });
+        elementNamePascalCase = elementNamePascalCase[0].toUpperCase() + elementNamePascalCase.substring(1, elementNamePascalCase.length);
+        info.wc.mappings[elementNamePascalCase] = wc.componentOptions.elementName;
         return template
             .replace(/\/\/{{importWC}}/, `import ${friendlyManifestId} from '${importPath}';
 //{{importWC}}`)
             .replace(/\/\/{{elementName}}/, `"${wc.componentOptions.elementName}": typeof ${friendlyManifestId}.propsDefinition & VueComponentBaseProps
 //{{elementName}}`)
-            .replace(/\/\/{{omfxelementName}}/, `"${wc.componentOptions.elementName.replace("omfx-", "").replace(/-([a-z])/g, function (g) { return g[1].toUpperCase(); })}": typeof ${friendlyManifestId} & VueComponentBaseProps
-            //{{omfxelementName}}`);
+            .replace(/\/\/{{nselementName}}/, `"${elementNamePascalCase}": typeof ${friendlyManifestId} & VueComponentBaseProps
+            //{{nselementName}}`);
     }
     return template;
 }

package/internal-do-not-import-from-here/variables.d.ts

@@ -5,6 +5,7 @@ import * as composers from "@omnia/tooling-composers";
 import * as enums from "../composers/models/Enums";
 import * as composer from '../composers/task';
 import { core, utils } from '@omnia/tooling';
+import { isExtensionEnv } from "./shared";
 import merge from 'webpack-merge';
 import webpack from 'webpack';
 declare var tooling: {
@@ -16,5 +17,4 @@ declare var tooling: {
     LogTypes: typeof utils.LogTypes;
 };
 declare var basePathProcess: string;
-declare var isExtensionEnv: boolean;
 export { omniaWebpackPlugins, basePathProcess, isExtensionEnv, tooling, webpack, chalk, timestamp, path, fs, extend, merge, del, md5File, composers, enums };

package/internal-do-not-import-from-here/variables.js

@@ -28,6 +28,8 @@ const enums = tslib_1.__importStar(require("@omnia/tooling-composers/internal-do
 exports.enums = enums;
 const composer = tslib_1.__importStar(require("@omnia/tooling-composers/internal-do-not-import-from-here/task"));
 const tooling_1 = require("@omnia/tooling");
+const shared_1 = require("./shared");
+Object.defineProperty(exports, "isExtensionEnv", { enumerable: true, get: function () { return shared_1.isExtensionEnv; } });
 const webpack_merge_1 = tslib_1.__importDefault(require("webpack-merge"));
 exports.merge = webpack_merge_1.default;
 const webpack_1 = tslib_1.__importDefault(require("webpack"));
@@ -36,5 +38,3 @@ var tooling = { composer, core: tooling_1.core, utils: tooling_1.utils, log: too
 exports.tooling = tooling;
 var basePathProcess = process.cwd();
 exports.basePathProcess = basePathProcess;
-var isExtensionEnv = fs.existsSync(basePathProcess + "/node_modules/@omnia/tooling-vue/package.json");
-exports.isExtensionEnv = isExtensionEnv;

package/internal-do-not-import-from-here/vite/hmr/graph.js

@@ -10,6 +10,7 @@ const utils_1 = require("./utils");
 const manifest_1 = require("./manifest");
 const vueJsx_1 = require("./vueJsx");
 const $ = tslib_1.__importStar(require("../../variables"));
+const shared_1 = require("../../shared");
 let fileGraphs = {};
 let manifests = {};
 const initialManifests = [
@@ -151,6 +152,7 @@ async function buildFileGraph(unknownId, code) {
         return { fileGraph, code };
     }
     fileGraph.js.scanned = true;
+    code = (0, shared_1.replaceWebComponentNamespaceMapping)(code);
     const esbuildTransformResult = await (0, vite_1.transformWithEsbuild)(code, id, esbuildTransformOptions);
     code = esbuildTransformResult.code;
     // d.ts or interface only

package/internal-do-not-import-from-here/webpack-loaders/ts-loader.d.ts

@@ -1,9 +1,6 @@
 export default function (): {
     test: RegExp;
-    use: ({
-        loader: any;
-        options?: undefined;
-    } | {
+    use: {
         loader: string;
         options: {
             loader: string;
@@ -16,5 +13,5 @@ export default function (): {
                 };
             };
         };
-    })[];
+    }[];
 }[];

package/internal-do-not-import-from-here/webpack-loaders/ts-loader.js

@@ -1,15 +1,10 @@
 'use strict';
 Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const $ = tslib_1.__importStar(require("../variables"));
 var path = require('path');
 function default_1() {
     return [{
             test: /\.ts$/,
             use: [
-                {
-                    loader: path.resolve(__dirname, $.isExtensionEnv ? './esbuild-custom-loader.js' : './esbuild-custom-loader.ts'),
-                },
                 {
                     loader: 'esbuild-loader',
                     options: {

package/internal-do-not-import-from-here/webpack-loaders/tsx-loader.d.ts

@@ -22,5 +22,8 @@ export default function (): {
                 };
             };
         };
+    } | {
+        loader: any;
+        options?: undefined;
     })[];
 }[];

package/internal-do-not-import-from-here/webpack-loaders/tsx-loader.js

@@ -61,6 +61,9 @@ function default_1() {
                     }
                 }
             },
+        },
+        {
+            loader: path.resolve(__dirname, $.isExtensionEnv ? './wc-loader.js' : './wc-loader.ts'),
         }
     ];
     return [

package/internal-do-not-import-from-here/webpack-loaders/wc-loader.d.ts

@@ -0,0 +1 @@
+export default function (content: any, context: any): string;

package/internal-do-not-import-from-here/webpack-loaders/wc-loader.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const shared_1 = require("../shared");
+function default_1(content, context) {
+    return (0, shared_1.replaceWebComponentNamespaceMapping)(content);
+}
+exports.default = default_1;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@omnia/tooling-vue",
   "license": "MIT",
-  "version": "8.0.79-vnext",
+  "version": "8.0.81-vnext",
   "description": "Used to bundle and serve manifests web component that build on Vue framework.",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
@@ -19,8 +19,8 @@
   ],
   "author": "Precio Fishbone",
   "dependencies": {
-    "@omnia/fx-models": "8.0.79-vnext",
-    "@omnia/tooling-composers": "8.0.79-vnext",
+    "@omnia/fx-models": "8.0.81-vnext",
+    "@omnia/tooling-composers": "8.0.81-vnext",
     "@types/mousetrap": "1.5.34",
     "@types/quill": "1.3.6",
     "@types/zepto": "1.0.29",