babel-polyfill报错

babel-polyfill报错

报错原因：babel-polyfill报错，是因为他只能在页面调用一次，如果调用多次就会冲突。
一个很好的例子，我之前写代码的时候，加引导页，我想点击按钮的时候加载页面的JS,后来，我想点击整个屏幕也可以加载，当这两个同时存在的时候，点击按钮的时候注入了JS，按钮也在页面的Div里，所以这个时候会触发两次，页面就会报错，为了避免这个问题，你要在加载页面的时候进行判断，无论哪种情况只能触发一次将JS注入页面。

<div id="root"><span id='no-react'></span></div>
<div class="first">
  <img src="./imgs/logo.png"/>
  <div>V 1.0</div>
//点击“立即进入”加载version
  <button onclick="version()">立即进入</button>
  <!--<div class="time_guide" onclick="version()">跳过(<span class="time_num">2</span>)</div>-->
</div>
<script>
   let count = 0;//这个变量是为了让页面只加载一次version.js
  function version() {
     count = 1;//count变成1以后就不会再出发version这个函数了
    let guide = document.querySelector('.first');
    if(guide){
      guide.remove();
    }
    let el = document.createElement('script');
    el.setAttribute('src', './version.js?tm=' + +new Date());
    document.body.insertBefore(el, document.body.firstChild);
  }
 // 2S后加载首页(一次性计时器)
  let timer = setTimeout(function() {
     clearTimeout(timer)
    if(count === 0){
       version()
     }
   },2000)
 // 倒计时效果(间歇性计时器)
   let time2 = 2;//设置初始值是2
   let timer2 = setTimeout(function() {
    //先获取显示倒计时数字的元素
     let time_num = document.querySelector('.time_num');
    //每次触发计时器的时候让数据-1
     time_num.innerHTML = time2 - 1;
    //当时间小于0s的时候清楚计时器
     if(time2 < 0){
       clearTimeout(timer2)
     }
   },1000)