Leanote's Blog

html转换成AST

想要的效果

输入:  let str ="<div><span>tests</span></div>"
输出 : {
  tag: 'div',
  children: [
    {
      tag: 'span'
    },
  ],
}

实现

      // 设置每个节点标签属性
     // let attrRE = /\s([^'"/\s><]+?)[\s/>]|([^\s=]+)=\s?(".*?"|'.*?')/g;
      function parseTag(tag) {
        let res = {
          type: "tag",
          name: "",
          voidElement: false,
          attrs: {},
          children: [],
        };
        let tagMatch = tag.match(/<\/?([^\s]+?)[/\s>]/);
        if (tagMatch) {
          // 标签名称为正则匹配的第2项
          res.name = tagMatch[1];
          if (tag.charAt(tag.length - 2) === "/") {
            // 判断tag字符串倒数第二项是不是 / 设置为空标签。 例子：<img/>
            res.voidElement = true;
          }
        }
        // 匹配所有的标签正则
        let classList = tag.match(/\s([^'"/\s><]+?)\s*?=\s*?(".*?"|'.*?')/g);
        if (classList && classList.length) {
          for (let i = 0; i < classList.length; i++) {
            // 去空格再以= 分隔字符串  得到['属性名称','属性值']
 

build.sh

#!/bin/bash
## ======= 批量打包 ======= ##
RED_COLOR='\E[1;31m **********'
GREEN_COLOR='\E[1;32m **********'
YELLOW_COLOR='\E[1;33m **********'
BLUE_COLOR='\E[1;34m **********'
RES='********** \E[0m'
y_dev="dev-20210420"
y_master="master"
h_dev="dev-20210804-haopinzhongguo"
h_master="master-haopingzhongguo"
fileName="admin"
distPath="/c/Users/Administrator/Desktop/云仓前端包"
[ $2 ] && distPath=$2
buildType=$1
successArr=()
log() {
    case $1 in
    red)
        echo -e "\n${RED_COLOR}$2${RES}"
        ;;
    green)
        echo -e "\n${GREEN_COLOR}$2${RES}"
        ;;
    yellow)
        echo -e "\n${YELLOW_COLOR}$2${RES}"
        ;;
    blue)
        echo -e "\n${BLUE_COLOR}$2${RES}"
        ;;
    *)
        echo -e "\n**********$2**********"
        ;;
    esac
}
log blue 开始打包
if [[ ! -e $distPath ]]; then
    rm -rf $distPath
    mkdir $distPath
    cd $distPath
    mkdir 好品中国测试 好品中国正式 友云正式
    cd -
fi
build() {
    git checkout $1
    git pull origin $1
    git 

忽略commit message, 后面加上--no-edit

git pull --no-edit
git merge dev --no-edit

1. 到网站下载zip（zip-3.0-bin.zip）和bzip2（bzip2-1.0.5-bin.zip）两个文件
2. 解压两个文件夹到C盘根目录下
3. zip的找到bin下面的zip.exe并复制到gitbash的安装目录的bin目录下(windows: where git), 在bzip2解压目录下的bin下，找到bzip2.dll，复制到git/user/bin目录下
4. 添加环境变量(可选步骤):
   
   • 在环境变量 -> 系统变量 -> PATH新增两个文件下的bin路径, 如: zip的C:\zip-3.0-bin\bin和bzip2的C:\bzip2-1.0.5-bin\bin

let name = ""
try {
    const file = require(`@/views${ route.path }.vue`)
    const componentName = file.default.name
    if (componentName) {
        name = componentName
    } else {
        throw Error("Fail: Don't Find 'name', src: '" + route.path + "'")
    }
} catch (err) {
    // console.log(777777777, err)
    const nameArr = route.path.split("/")
    let setName = replaceReg(nameArr[nameArr.length - 1])
    if (setName.length < 6 && nameArr[nameArr.length - 2]) {
        name = replaceReg(nameArr[nameArr.length - 2]) + setName
    }
}

嵌套路由里的子路由跳转会触发父路由的生命周期

注意: 是否在里使用了:key, key如果不一样会每次都触发更新

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]
function promiseForEach(arr, cb) {
    let realResult = []
    let result = Promise.resolve()
    arr.forEach((a, index) => {
        result = result.then(() => {
            if (typeof cb === "function") {
                return cb(a).then((res) => {
                    realResult.push(res)
                })
            }
        })
    })
    return result.then(() => {
        return realResult
    })
}
promiseForEach(arr, (ele) => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(ele)
            return resolve(ele)
        }, Math.random() * 1000)
    })
}).then((data) => {
    console.log("成功")
    console.log(data)
}).catch((err) => {
    console.log("失败")
    console.log(err)
})

使用一个空白页来中转

// refresh.vue
<template>
    <div></div>
</template>
<script>
export default {
    name: "refresh",
    data() {
        return {}
    },
    beforeRouteEnter(to, from, next) {
        next(vm => {
            vm.$router.replace({ path: from.path, query: to.query })
        })
    }
}
</script>
// router.vue
{
    path: "/refresh",
    name: "refresh",
    component: () =>
        import(/* webpackChunkName: "page" */ "@/components/refresh"),
    meta: {
        keepAlive: false,
        isTab: false,
        isAuth: false
    }
}
// main.js (如果需要设置所有的)
router.beforeEach((to, from, next) => {
    if (from.path === to.path) {
        next({ path: "/refresh", query: to.query })
        return
    }
}