baseParse 有参数可以处理重复属性的逻辑吗

在 Vue 3 的源码中，baseParse 函数主要用于将模板字符串解析为抽象语法树（AST）。对于重复属性（如 <div id="1" id="2"></div>），Vue 的编译器会直接抛出错误，因为这是模板语法中的非法行为。

baseParse 本身并没有直接提供参数来处理重复属性的逻辑，但可以通过修改或扩展 Vue 编译器的行为来实现自定义处理。以下是一些可能的思路：

1. 通过 `onError` 回调处理错误

baseParse 的内部实现支持一个 onError 回调函数，用于捕获解析过程中的错误。如果你想自定义处理重复属性的逻辑，可以拦截错误并进行自定义处理。

例如：

import { baseParse } from '@vue/compiler-core';

const template = `<div id="1" id="2"></div>`;

const ast = baseParse(template, {
  onError: (error) => {
    if (error.code === 44) { // 重复属性的错误码
      console.warn('重复属性被检测到，但已忽略:', error.message);
    } else {
      throw error; // 其他错误继续抛出
    }
  },
});

console.log(ast);

在上面的代码中，onError 回调捕获了重复属性的错误（错误码为 44），并通过自定义逻辑忽略它。

2. 手动预处理模板字符串

在调用 baseParse 之前，可以通过正则表达式或其他方式对模板字符串进行预处理，移除重复的属性。

例如：

function removeDuplicateAttributes(template) {
  return template.replace(/(\s+\w+="[^"]*")(?=.*\1)/g, '');
}

const template = `<div id="1" id="2"></div>`;
const cleanedTemplate = removeDuplicateAttributes(template);
console.log(cleanedTemplate); // 输出: <div id="1"></div>

const ast = baseParse(cleanedTemplate);
console.log(ast);

这种方法简单直接，但需要确保正则表达式足够健壮。

3. 扩展 Vue 编译器的行为

如果你需要更灵活的方式，可以通过扩展 Vue 编译器的 transform 阶段来处理重复属性。这需要更深入地了解 Vue 的编译器工作原理。

例如：

import { baseParse, transform } from '@vue/compiler-core';

const template = `<div id="1" id="2"></div>`;
const ast = baseParse(template);

transform(ast, {
  nodeTransforms: [
    (node) => {
      if (node.type === 1) { // 节点类型为 Element
        const seen = new Set();
        node.props = node.props.filter((prop) => {
          if (prop.type === 6 && seen.has(prop.name)) {
            console.warn(`重复属性 "${prop.name}" 被移除`);
            return false;
          }
          seen.add(prop.name);
          return true;
        });
      }
    },
  ],
});

console.log(ast);