@omnia/tooling-vue
Version:
Used to bundle and serve manifests web component that build on Vue framework.
144 lines (143 loc) • 6.2 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.injectHotReloadScript = exports.transformVueJsx = void 0;
const tslib_1 = require("tslib");
const hash_sum_1 = tslib_1.__importDefault(require("hash-sum"));
const core_1 = require("@babel/core");
const fx_models_1 = require("@omnia/fx-models");
const $ = tslib_1.__importStar(require("../../variables"));
async function transformVueJsx(code, id) {
const babelTransformResult = await (0, core_1.transformAsync)(code, {
ast: true,
presets: [
[
// '@vue/babel-preset-jsx',
$.isExtensionEnv ?
'./node_modules/@omnia/tooling-vue/internal-do-not-import-from-here/babel/preset-jsx.js'
: './client/tooling/vue/babel/preset-jsx.ts',
{
vModel: true,
compositionAPI: true,
}
]
]
});
injectHotReloadScript(babelTransformResult, code, id);
return babelTransformResult.code;
}
exports.transformVueJsx = transformVueJsx;
// Customized from plugin-vue-jsx https://github.com/vitejs/vite/blob/main/packages/plugin-vue-jsx/index.js
function injectHotReloadScript(babelFile, code, id) {
const [hotComponents, hasDefault] = getHotComponents(babelFile, code, id);
if (hotComponents.length) {
if (hasDefault) {
babelFile.code = babelFile.code.replace(/export default defineVueComponent/g, `const __default__ = defineVueComponent`);
babelFile.code = babelFile.code.replace(/export default defineVueWebComponent/g, `const __default__ = defineVueWebComponent`);
}
if (!/\?vue&type=script/.test(id)) {
let code = babelFile.code;
let callbackCode = ``;
code = '\n' +
`const __VUE_HOT_RELOAD_API__ = omniaWebpackJsonp['bb000000-0000-bbbb-0000-0000000000bb']['${fx_models_1.OmniaResourceManifests.HMR}']('f8ee4fc2-3876-4997-80d7-5264eaee44bb');` + '\n' + code;
for (const { local, exported, id } of hotComponents) {
code +=
`\n\n/**\n * Vue Hot Reload\n */\n${local}.__hmrId = "${id}";` +
`\n__VUE_HOT_RELOAD_API__.createRecord("${id}", ${local});`;
callbackCode = callbackCode + '\n\n' +
` __VUE_HOT_RELOAD_API__.reload("${id}", __${exported});`;
}
code += `\nimport.meta.hot.accept(({${hotComponents
.map((c) => `${c.exported}: __${c.exported}`)
.join(',')}}) => {${callbackCode}\n});`;
babelFile.code = code;
}
if (hasDefault) {
babelFile.code += `\n\nexport default __default__;`;
}
}
}
exports.injectHotReloadScript = injectHotReloadScript;
function getHotComponents(babelFile, code, id) {
let hasDefault = false;
const declaredComponents = [];
const hotComponents = [];
for (const node of babelFile.ast.program.body) {
if (node.type === 'VariableDeclaration') {
const names = parseComponentDecls(node, code);
if (names.length) {
declaredComponents.push(...names);
}
}
if (node.type === 'ExportNamedDeclaration') {
if (node.declaration &&
node.declaration.type === 'VariableDeclaration') {
hotComponents.push(...parseComponentDecls(node.declaration, code).map(({ name }) => ({
local: name,
exported: name,
id: (0, hash_sum_1.default)(id + name)
})));
}
else if (node.specifiers.length) {
for (const spec of node.specifiers) {
if (spec.type === 'ExportSpecifier' &&
spec.exported.type === 'Identifier') {
const matched = declaredComponents.find(({ name }) => name === spec.local.name);
if (matched) {
hotComponents.push({
local: spec.local.name,
exported: spec.exported.name,
id: (0, hash_sum_1.default)(id + spec.exported.name)
});
}
}
}
}
}
if (node.type === 'ExportDefaultDeclaration') {
if (node.declaration.type === 'Identifier') {
const _name = node.declaration.name;
const matched = declaredComponents.find(({ name }) => name === _name);
if (matched) {
hotComponents.push({
local: node.declaration.name,
exported: 'default',
id: (0, hash_sum_1.default)(id + 'default')
});
}
}
else if (isDefineComponentCall(node.declaration)) {
hasDefault = true;
hotComponents.push({
local: '__default__',
exported: 'default',
id: (0, hash_sum_1.default)(id + 'default')
});
}
}
}
return [hotComponents, hasDefault];
}
function parseComponentDecls(node, source) {
const names = [];
for (const decl of node.declarations) {
if (decl.id.type === 'Identifier' && (isDefineComponentCall(decl.init) || isClassComponentCall(decl.init))) {
names.push({
name: decl.id.name
});
}
}
return names;
}
function isDefineComponentCall(node) {
return (node &&
node.type === 'CallExpression' &&
node.callee.type === 'Identifier' &&
(node.callee.name === 'defineVueComponent' || node.callee.name === 'defineVueWebComponent'));
}
function isClassComponentCall(node) {
return (node &&
node.type === 'ClassExpression' &&
node.superClass &&
node.superClass.type === 'Identifier' &&
(node.superClass.name === 'VueComponentBase' || node.superClass.name === 'Vue'));
}