| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566 | <!DOCTYPE html><html lang="zh-CN">  <head>    <meta charset="UTF-8" />    <link rel="icon" href="/favicon.ico" />    <meta name="viewport" content="width=device-width, initial-scale=1.0" />    <title>商品零售+点餐系统</title>    <style>      * {        margin: 0;        padding: 0;      }      .preload {        display: flex;        align-items: center;        justify-content: center;        height: 100vh;        width: 100vw;      }      .circular {        height: 42px;        width: 42px;        animation: loading-rotate 2s linear infinite;      }      .circular .path {        animation: loading-dash 1.5s ease-in-out infinite;        stroke-dasharray: 90, 150;        stroke-dashoffset: 0;        stroke-width: 2;        stroke: #4073fa;        stroke-linecap: round;      }      @keyframes loading-rotate {        100% {          transform: rotate(1turn);        }      }      @keyframes loading-dash {        0% {          stroke-dasharray: 90, 150;          stroke-dashoffset: -40px;        }        100% {          stroke-dasharray: 90, 150;          stroke-dashoffset: -120px;        }      }    </style>  </head>  <body>    <div id="app">      <div class="preload">        <svg viewBox="25 25 50 50" class="circular">          <circle cx="50" cy="50" r="20" fill="none" class="path"></circle>        </svg>      </div>    </div>    <script type="module" src="/src/main.ts"></script>  </body></html>
 |