From 04a6db7634286eaff9d46bd55c735bfa0ea740f6 Mon Sep 17 00:00:00 2001 From: fahasikei <1299484460@qq.com> Date: Mon, 30 Oct 2023 19:44:49 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8Dtemplate=E4=B8=AD?= =?UTF-8?q?=E5=9C=A8=E5=BC=95=E7=94=A8=E5=B7=A5=E5=85=B7=E7=B1=BB=E6=97=B6?= =?UTF-8?q?=E8=B7=AF=E5=BE=84=E8=BD=AC=E6=8D=A2=E9=94=99=E8=AF=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/taroize/src/global.ts | 2 ++ packages/taroize/src/template.ts | 18 ++++++++++++++++-- packages/taroize/src/utils.ts | 13 +++++++++++++ packages/taroize/src/wxml.ts | 31 ++++++++++++++++++++++++++----- 4 files changed, 57 insertions(+), 7 deletions(-) diff --git a/packages/taroize/src/global.ts b/packages/taroize/src/global.ts index 6e364bb0320..e8d8e88940c 100644 --- a/packages/taroize/src/global.ts +++ b/packages/taroize/src/global.ts @@ -5,6 +5,7 @@ export const usedComponents = new Set() export const errors: string[] = [] export const globals = { + rootPath: '', hasCatchTrue: false, logFilePath: '', } @@ -12,6 +13,7 @@ export const globals = { export const THIRD_PARTY_COMPONENTS = new Set() export const resetGlobals = (rootPath) => { + globals.rootPath = rootPath globals.hasCatchTrue = false globals.logFilePath = path.join(rootPath, 'taroConvert', '.convert', 'convert.log') THIRD_PARTY_COMPONENTS.clear() diff --git a/packages/taroize/src/template.ts b/packages/taroize/src/template.ts index 8eef96f53a7..ec078a76bcd 100644 --- a/packages/taroize/src/template.ts +++ b/packages/taroize/src/template.ts @@ -5,7 +5,7 @@ import { dirname, extname, relative, resolve } from 'path' import { errors } from './global' import { buildBlockElement, buildRender, getLineBreak, pascalName, printToLogFile, setting } from './utils' -import { createWxmlVistor, parseWXML } from './wxml' +import { createWxmlVistor, parseWXML, WXS } from './wxml' function isNumeric (n) { return !isNaN(parseFloat(n)) && isFinite(n) @@ -108,7 +108,7 @@ export function preParseTemplate (path: NodePath) { } } -export function parseTemplate (path: NodePath, dirPath: string) { +export function parseTemplate (path: NodePath, dirPath: string, wxses: WXS[]) { if (!path.container || !path.isJSXElement()) { return } @@ -150,6 +150,19 @@ export function parseTemplate (path: NodePath, dirPath: string) { const className = buildTemplateName(value.value) path.traverse(createWxmlVistor(loopIds, refIds, dirPath, [], imports)) + + // refIds中可能包含wxs模块，应从refIds中去除并单独以模块的形式导入 + const usedWxses = new Set + const refdata = refIds + refdata.forEach((refId) => { + wxses.forEach((wxsId) => { + if (wxsId.module.includes(refId)) { + usedWxses.add(wxsId) + refIds.delete(refId) + } + }) + }) + const firstId = Array.from(refIds)[0] refIds.forEach((id) => { if (loopIds.has(id) && id !== firstId) { @@ -183,6 +196,7 @@ export function parseTemplate (path: NodePath, dirPath: string) { name: className, ast: classDecl, tmplName: templateName, + usedWxses: usedWxses, } } else if (is && t.isJSXAttribute(is.node)) { const value = is.node.value diff --git a/packages/taroize/src/utils.ts b/packages/taroize/src/utils.ts index 7524899e33f..9ade520629c 100644 --- a/packages/taroize/src/utils.ts +++ b/packages/taroize/src/utils.ts @@ -16,6 +16,19 @@ export function isAliasThis (p: NodePath, name: string) { return false } +/** + * 标准化传入路径 + * + * @param path 如D:\\admin格式路径 + * @returns 替换\\返回标准路径 + */ +export function normalizePath (path) { + if (typeof path === 'undefined') { + return '' + } + return path.replace(/\\/g, '/') +} + export function isValidVarName (str?: string) { if (typeof str !== 'string') { return false diff --git a/packages/taroize/src/wxml.ts b/packages/taroize/src/wxml.ts index faa0effa986..aaeb2e374c7 100644 --- a/packages/taroize/src/wxml.ts +++ b/packages/taroize/src/wxml.ts @@ -19,10 +19,12 @@ import { codeFrameError, DEFAULT_Component_SET, isValidVarName, + normalizePath, parseCode, } from './utils' const { prettyPrint } = require('html') +const pathTool = require('path') const allCamelCase = (str: string) => str.charAt(0).toUpperCase() + camelCase(str.substr(1)) @@ -246,6 +248,26 @@ export const createPreWxmlVistor = ( } as Visitor } +/** + * 根据template中使用的wxs组装需要导入的wxs语句 + * 如： import xxx from '../xxx.wxs.js' + * + * @param templateFileName template模版文件名 + * @param usedWxses template中使用的变量是wxs模块的集合 + * @param dirPath 当前解析文件的路径 + * @returns 需要导入的wxs语句集合 + */ +export function getWxsImports (templateFileName, usedWxses, dirPath) { + const templatePath = pathTool.join(globals.rootPath, 'imports', `${templateFileName}.js`) + const wxsImports: (t.ImportDeclaration | t.VariableDeclaration)[] = [] + for (const usedWxs of usedWxses) { + const wxsAbsPath = pathTool.resolve(dirPath, `${usedWxs.src}.js`) + const wxsRelPath = pathTool.relative(pathTool.dirname(templatePath), wxsAbsPath) + wxsImports.push(buildImportStatement(normalizePath(wxsRelPath), [], usedWxs.module)) + } + return wxsImports +} + export const createWxmlVistor = ( loopIds: Set, refIds: Set, @@ -401,13 +423,11 @@ export const createWxmlVistor = ( ) } if (tagName === 'Template') { - // path.traverse({ - // JSXAttribute: jsxAttrVisitor - // }) - const template = parseTemplate(path, dirPath) + const template = parseTemplate(path, dirPath, wxses) if (template) { let funcs = new Set() - const { ast: classDecl, name, tmplName } = template + const { ast: classDecl, name, tmplName, usedWxses } = template + const wxsImports = getWxsImports(name, usedWxses, dirPath) const taroComponentsImport = buildImportStatement('@tarojs/components', [...usedComponents]) const taroImport = buildImportStatement('@tarojs/taro', [], 'Taro') const reactImport = buildImportStatement('react', [], 'React') @@ -419,6 +439,7 @@ export const createWxmlVistor = ( reactImport, taroImport, withWeappImport, + ...wxsImports, classDecl, t.exportDefaultDeclaration(t.identifier(name)) )