@aiot-toolkit/parser 2.0.6-beta.2 → 2.0.6-beta.3

package/lib/ux/parser/StyleParser.d.ts

@@ -3,7 +3,7 @@ import IOptions from '../config/IOptions';
 import { IStyleAst } from '../interface/IStyleAst';
 import ITranslateOption from '../interface/ITranslateOption';
 import { IImageFunction } from '../interface/IImageResource';
-import { RawSourceMap, SourceMapConsumer } from 'source-map';
+import { SourceMapConsumer } from 'source-map';
 /**
  * StyleParser
  * 1. 根据语言类型分别转为CSS样式
@@ -15,9 +15,10 @@ declare class StyleParser implements IParser<IStyleAst> {
     readonly compilerOption: ITranslateOption;
     collectImageResource: IImageFunction;
     readonly styleLineOffset: number;
-    nodeMap: RawSourceMap | string;
+    nodeMap: string;
     sourceMapConsumer: SourceMapConsumer;
     private styleMapUtil;
+    private isCss;
     readonly QUICKAPP_CONFIG = "quickapp.config.js";
     constructor(options: IOptions, compilerOption: ITranslateOption, collectImageResource: IImageFunction, styleLineOffset: number);
     parser(content: string, fileName: string): Promise<ParserResult<IStyleAst>>;

package/lib/ux/parser/StyleParser.js

@@ -32,19 +32,21 @@ const {
  * 3. 把解析结果转换为目标格式
  */
 class StyleParser {
+  // 是否是css样式代码
+  isCss = true;
   QUICKAPP_CONFIG = 'quickapp.config.js';
   constructor(options, compilerOption, collectImageResource, styleLineOffset) {
     this.options = options;
     this.compilerOption = compilerOption;
     this.collectImageResource = collectImageResource;
     this.styleLineOffset = styleLineOffset;
-    this.nodeMap = {
+    this.nodeMap = JSON.stringify({
       version: 3,
       sources: [],
       names: [],
       mappings: '',
       file: ''
-    };
+    });
   }
   async parser(content, fileName) {
     const {
@@ -147,7 +149,8 @@ class StyleParser {
         relativeUrls: true,
         sourceMap: {
           sourceMapURL: `${baseName}.map`,
-          outputSourceFiles: true
+          outputSourceFiles: true,
+          sourceMapRootpath: 'file:///'
         }
       }, (error, output) => {
         if (error) {
@@ -161,6 +164,7 @@ class StyleParser {
           CSSCode = output?.css ? output.css : '';
           if (output?.map) {
             this.nodeMap = output.map;
+            this.isCss && (this.isCss = false);
           }
           resolve(CSSCode);
         }
@@ -177,7 +181,7 @@ class StyleParser {
       onLog,
       filePath
     } = this.options;
-    const url = `file://${filePath}`;
+    const url = `file:///${filePath}`;
     const alias = this.getAlias();
 
     // sass 的 alias 处理依赖当前文件路径
@@ -196,6 +200,7 @@ class StyleParser {
       });
       if (Result.sourceMap) {
         this.nodeMap = JSON.stringify(Result.sourceMap);
+        this.isCss && (this.isCss = false);
       }
       return Result.css;
     } catch (error) {
@@ -217,23 +222,29 @@ class StyleParser {
       onLog,
       filePath
     } = this.options;
+    const newFilePath = this.isCss ? filePath : `file:///${filePath}`;
     const alias = this.getAlias();
     try {
       const result = await (0, _postcss.default)([(0, _postcssImport.default)({
-        resolve: id => {
+        resolve: (id, basedir) => {
+          // 处理所有路径中的 file:/// 前缀
+          const cleanId = id.replace(/^file:\/\/\//, '');
+          const cleanBase = basedir.replace(/^file:\/\/\//, '');
+          const filePath = _path.default.resolve(cleanBase, cleanId);
           for (const [key, value] of Object.entries(alias)) {
-            if (id.startsWith(key)) {
-              return id.replace(key, value);
+            if (filePath.startsWith(key)) {
+              return filePath.replace(key, value);
             }
           }
-          return id;
+          return filePath;
         }
       }), _postcssUrl.default]).process(sourceContent, {
-        from: filePath,
+        from: newFilePath,
         map: {
           prev: this.nodeMap,
           inline: false,
-          annotation: true
+          sourcesContent: true,
+          absolute: this.isCss
         }
       });
       this.nodeMap = result.map.toString();
@@ -307,7 +318,7 @@ class StyleParser {
       type: '',
       prelude: [],
       block: [],
-      position: sourceNode.loc ? this.styleMapUtil.transfromLocToPosition(sourceNode.loc) : undefined
+      position: sourceNode.loc ? this.styleMapUtil.transfromLocToPosition(sourceNode.loc, false) : undefined
     };
     const {
       type,
@@ -330,7 +341,7 @@ class StyleParser {
       name: '',
       prelude: [],
       rules: [],
-      position: sourceNode.loc ? this.styleMapUtil.transfromLocToPosition(sourceNode.loc) : undefined
+      position: sourceNode.loc ? this.styleMapUtil.transfromLocToPosition(sourceNode.loc, false) : undefined
     };
     const {
       type,
@@ -376,7 +387,7 @@ class StyleParser {
       type: '',
       name: '',
       block: [],
-      position: sourceNode.loc ? this.styleMapUtil.transfromLocToPosition(sourceNode.loc) : undefined
+      position: sourceNode.loc ? this.styleMapUtil.transfromLocToPosition(sourceNode.loc, false) : undefined
     };
     const {
       type,
@@ -494,7 +505,7 @@ class StyleParser {
       let value = '';
       nodeValue.children.map(v => {
         let tempTargetValue;
-        const tempPosition = v.loc ? this.styleMapUtil.transfromLocToPosition(v.loc) : undefined;
+        const tempPosition = v.loc ? this.styleMapUtil.transfromLocToPosition(v.loc, false) : undefined;
         switch (v.type) {
           case 'Operator':
             value = _cssTree.default.generate(v);
@@ -578,7 +589,7 @@ class StyleParser {
       targetList.push({
         name: nodeName,
         value: valueList,
-        position: node.loc ? this.styleMapUtil.transfromLocToPosition(node.loc) : undefined
+        position: node.loc ? this.styleMapUtil.transfromLocToPosition(node.loc, false) : undefined
       });
     }
     return targetList;

package/lib/ux/translate/vela/StyleToTypescript.js

@@ -94,8 +94,14 @@ class StyleToTypescript {
         const selector = node[i];
         const {
           type,
-          name
+          name: orgName
         } = selector;
+
+        // 去除名称中的转义符，例如 源码是  .w-20\% {},  希望生成 w-20%
+        // 注意：此处的反转义不能用 JSON.parse
+        // 原因：js中 % 不需要转义，但css选择器中%需要转义，两者规则不一样，所以不能使用 JSON.parse
+        // 示例：js可以写'abc%', 但css选择器中必须写'abc\%'
+        const name = orgName.replace(/\\(.{1})/g, '$1');
         // 选择器类型转为数字
         const selectorIndex = (0, _StyleSelectorType.findSelectorIndex)(type);
         if (type === _StyleSelectorType.Selector.COMBINATOR) {

package/lib/ux/translate/vela/utils/AttributeConfig.js

@@ -29,7 +29,7 @@ const ATTRIBUTE_CONFIG = {
           return $classValue$;
         }`;
       }
-      return `[${JSON.parse(result).split(' ').map(item => `"${item.trim()}"`).filter(Boolean).join(',')}]`;
+      return `[${JSON.parse(result).split(' ').map(item => item.trim()).filter(Boolean).map(item => JSON.stringify(item)).join(',')}]`;
     }
   },
   style: {

package/lib/ux/utils/StyleMapUtil.d.ts

@@ -18,11 +18,10 @@ declare class StyleMapUtil {
      *  3.4 原始位置的endColumn根据map结果，发现存在1个位置的差异，所以-1
      *  3.5 source存储来源的文件
      * @param location 生成结果中节点的位置信息
-     * @param consumer 经过解析器获取的map信息生成的consumer对象
-     * @param offset 当前样式代码在ux文件中的偏移量
+     * @param useAbsolutePath 是否生成绝对路径
      * @returns
      */
-    transfromLocToPosition(location: CssLocation): {
+    transfromLocToPosition(location: CssLocation, useAbsolutePath?: boolean): {
         pos: number;
         end: number;
         startLine: number;

package/lib/ux/utils/StyleMapUtil.js

@@ -25,11 +25,11 @@ class StyleMapUtil {
    *  3.4 原始位置的endColumn根据map结果，发现存在1个位置的差异，所以-1
    *  3.5 source存储来源的文件
    * @param location 生成结果中节点的位置信息
-   * @param consumer 经过解析器获取的map信息生成的consumer对象
-   * @param offset 当前样式代码在ux文件中的偏移量
+   * @param useAbsolutePath 是否生成绝对路径
    * @returns
    */
   transfromLocToPosition(location) {
+    let useAbsolutePath = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
     const {
       projectPath
     } = this.options;
@@ -41,7 +41,7 @@ class StyleMapUtil {
       line: location.end.line,
       column: location.end.column
     });
-    let nodeRelativePath = '';
+    let nodePath = '';
     if (nodeStartPosition.source?.endsWith('.ux') && nodeStartPosition.line) {
       nodeStartPosition.line = nodeStartPosition.line - 1 + this.lineOffset;
     }
@@ -54,7 +54,8 @@ class StyleMapUtil {
       if (decodeStr.startsWith('file://')) {
         decodeStr = (0, _url.fileURLToPath)(decodeStr);
       }
-      nodeRelativePath = _path.default.relative(projectPath, decodeStr).replaceAll(_path.default.sep, _path.default.posix.sep);
+      // useAbsolutePath为false，返回相对路径
+      nodePath = (useAbsolutePath ? decodeStr : _path.default.relative(projectPath, decodeStr)).replaceAll(_path.default.sep, _path.default.posix.sep);
     }
     return {
       pos: 0,
@@ -63,7 +64,7 @@ class StyleMapUtil {
       startColumn: nodeStartPosition.column || 0,
       endLine: nodeEndPosition.line || 0,
       endColumn: nodeEndPosition.column || 0,
-      source: nodeRelativePath
+      source: nodePath
     };
   }
 }

package/lib/ux/utils/StyleUtil.js

@@ -351,7 +351,6 @@ class StyleUtil {
           endOffset: (error.offset || 0) + propertyLength,
           source: css
         });
-        continue;
       }
     }
     return syntaxErrors;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aiot-toolkit/parser",
-  "version": "2.0.6-beta.2",
+  "version": "2.0.6-beta.3",
   "description": "Parse the source code of aiot and convert it to the AST (Abstract Syntax Tree) of the target code.",
   "keywords": [
     "aiot",
@@ -20,7 +20,7 @@
     "test": "node ./__tests__/parser.test.js"
   },
   "dependencies": {
-    "@aiot-toolkit/shared-utils": "2.0.6-beta.2",
+    "@aiot-toolkit/shared-utils": "2.0.6-beta.3",
     "@babel/core": "^7.23.6",
     "@babel/generator": "^7.24.10",
     "@babel/parser": "^7.24.8",
@@ -31,7 +31,7 @@
     "css-tree": "npm:aiot-css-tree@^2.3.1",
     "csstree-validator": "^3.0.0",
     "eslint": "^8.46.0",
-    "file-lane": "2.0.6-beta.2",
+    "file-lane": "2.0.6-beta.3",
     "fs-extra": "^11.2.0",
     "google-protobuf": "^3.21.2",
     "less": "^4.2.0",
@@ -60,5 +60,5 @@
     "@types/tinycolor2": "^1.4.6",
     "babel-plugin-tester": "^11.0.4"
   },
-  "gitHead": "d0057f9e62ac191d21445787667217cfa4aff1e9"
+  "gitHead": "2e2ba4b1d293218736343237d963fe93c5fb27a8"
 }