新版本通知，判断资源是否存在，flv协议资源无法中断处理，vue3响应式，git revert，面包屑，flex-basic与width，vite热更新失效

1.前端版本更新通知，技术文档：
https://segmentfault.com/a/1190000041900021

2.知识盲区http协议
欲判断某个资源是否存在，我们通常使用GET，但这里用HEAD则意义更加明确。

  export function isExistFile(filepath:string){
    if(filepath == null || filepath === "" ){
      return false
    }
    var xmlhttp;
    if (window.XMLHttpRequest){
      xmlhttp=new XMLHttpRequest();
    }else{
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
      xmlhttp.open("HEAD",filepath,false);
      xmlhttp.send();
      if(xmlhttp.readyState === 4){
      if(xmlhttp.status === 200) return true; //url存在
      else if(xmlhttp.status === 404) return false; //url不存在
      else return false;//其他状态
    }
  }

注意：判断服务的资源是否正常访问，但是跨域不起作用

3.flv暂停后播放最新画面
思路：替换播放链接
场景：SDK播放器:https://cloud.tencent.com/document/product/881/30820
问题：直播间画面播放不了
描述：在直播间内，播放直播（flv）链接；操作：暂停播放，获取直播最新播放画面，发现上一个请求的flv资源没有中断，多次暂停播放，导致直播间画面播放不了。

解决方案：
既然中断不了了，就读取本地缓存最新的内容，没缓存再请求一次链接

4.vue3响应式原理
Vue官方公众号推荐：https://mp.weixin.qq.com/s/Kk1AoXZ02n3GYTixCRvZkQ

5.git revert 和git reset

git revert 撤销 某次操作，此次操作之前和之后的commit和history都会保留，并且把这次撤销
作为一次最新的提交
    * git revert HEAD                  撤销前一次 commit
    * git revert HEAD^               撤销前前一次 commit
    * git revert commit （比如：fa042ce57ebbe5bb9c8db709f719cec2c58ee7ff）撤销指定的版本，
    撤销也会作为一次提交进行保存。
git revert是提交一个新的版本，将需要revert的版本的内容再反向修改回去，
版本会递增，不影响之前提交的内容
--------------------------------------------------------------------------------------------------------------------------------------------
git revert 和 git reset的区别 
1. git revert是用一次新的commit来回滚之前的commit，git reset是直接删除指定的commit。 
2. 在回滚这一操作上看，效果差不多。但是在日后继续merge以前的老版本时有区别。因为git revert是用一次逆向的commit“中和”之前的提交，因此日后合并老的branch时，导致这部分改变不会再次出现，但是git reset是之间把某些commit在某个branch上删除，因而和老的branch再次merge时，这些被回滚的commit应该还会被引入。 
3. git reset 是把HEAD向后移动了一下，而git revert是HEAD继续前进，只是新的commit的内容和要revert的内容正好相反，能够抵消要被revert的内容

6.面包屑：

6.1vue3监听路由变化

 onBeforeRouteUpdate((to) => {
       // 在当前路由改变，但是该组件被复用时调用
      // 举例来说，对于一个带有动态参数的路径 /foo/:id，在 /foo/1 和 /foo/2 之间跳转的时候，
     // 由于会渲染同样的 Foo 组件，因此组件实例会被复用。而这个钩子就会在这个情况下被调用。
     console.log('onBeforeRouteUpdate',to.path);     
   });

另外可以采用如下解决办法：

let router = useRouter()
 watch(
    () =>router.currentRoute.value.path,
    (newValue,oldValue)=> {
          console.log('newValue',newValue);
    },
    { immediate: true }
  )

6.2route.matched
可以做面包屑

7.flex-basis
当一个元素同时被设置了 flex-basis (除值为 auto 外) 和 width (或者在 flex-direction: column 情况下设置了height) , flex-basis 具有更高的优先级

8.Vite热更新失效，刷新也不生效，重启npm run dev才生效
解决方案：
文件夹名称严格注意大小写
比如：
batchAddSection 目录名
index.vue 文件名
路由写成：
{ path: ‘batch-add’, component: () => import(“@/views/BatchAddSection /index.vue”), }
就报错了
正确的路由应该是
{ path: ‘batch-add’, component: () => import(“@/views/batchAddSection /index.vue”), }