wxml ast 解析替换属性值

解析器依赖 @vivaxy/wxml

Getting Started

安装模块: npm install @syyfe/wxml-url-rewriter

Settings

export interface IOptions {
    /**
     * 替换追加前缀
     * @type {string}
     * @memberof WxmlUrlRewrite
     */
    base?: string;

    /**
     * wxml 匹配属性
     * @type {Record<string, string>}
     * @memberof WxmlUrlRewrite
     */
    wxmlAttribute?: Record<string, string>;

    /**
     * 自定义替换URL方法
     * @type {*}
     * @memberof IParams
     */
    rewriteURL?: any;

    /**
     * 内联样式的替换，默认开启
     * @type {boolean}
     * @memberof IOptions
     */
    replaceCss?: boolean;
}

默认支持

wxmlDefaults = {
    img: "src",
    video: "poster",
    "cover-image": "src"
};

也可自定义添加匹配替换，举例 vant-ui 中的组件

wxmlAttribute: {
    "van-empty": "image",
    "van-cell": "icon",
    "van-image": "src",
    "van-icon": "name"
}

Usage

const WxmlUrlRewrite = require("@syyfe/wxml-url-rewriter");
const wxml = `<image src="/assets/1.jpg" alt="" />`;
const newWxml = new WxmlUrlRewrite({
    base: "https://www.cdn.com",
    wxmlAttribute: {
        "van-empty": "image",
        "van-cell": "icon",
        "van-image": "src",
        "van-icon": "name"
    }
}).apply(wxml);

自定义替换方法

const WxmlUrlRewrite = require("@syyfe/wxml-url-rewriter");
const wxml = `<image src="/assets/1.jpg" alt="" />
<view style="background-image: url('/assets/1.png');"></view>
<style>
.pg{
    background-image: url('/assets/1.png');
}
</style>
`;
const newWxml = new WxmlUrlRewrite({
    rewriteURL: (val) => {
        return "https://www.71360.com/static" + val;
    },
    wxmlAttribute: {
        "van-empty": "image",
        "van-cell": "icon",
        "van-image": "src",
        "van-icon": "name"
    }
}).apply(wxml);