vue@3.2.x.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>CDN Vue develop config</title>
    <!-- Vue@3.5.13 {@link https://cn.vuejs.org/} -->
    <script src="https://unpkg.com/vue@3.5.13/dist/vue.global.prod.js"></script>
    <!-- Vue 文件转换库 {@link https://github.com/FranckFreiburger/vue3-sfc-loader} -->
    <script src="https://unpkg.com/vue3-sfc-loader@0.9.5/dist/vue3-sfc-loader.js"></script>
    <!-- Vue Demi {@link https://github.com/vueuse/vue-demi} -->
    <script src="https://cdn.jsdelivr.net/npm/vue-demi@0.13.11"></script>
    <!-- VueUse {@link https://vueuse.org/} -->
    <script src="https://unpkg.com/@vueuse/shared@11.3.0/index.iife.min.js"></script>
    <script src="https://unpkg.com/@vueuse/core@11.3.0/index.iife.min.js"></script>
    <!-- Pinia {@link https://pinia.vuejs.org/zh/} {@link 参考 https://github.com/vuejs/pinia/discussions/1051}  -->
    <script src="https://cdn.jsdelivr.net/npm/pinia@2.0.36/dist/pinia.iife.min.js"></script>

    <!-- UnoCSS Reset -->
    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/@unocss/reset/tailwind.min.css"
    />
    <!-- User defined 请确保加载于 UnoCSS 之前-->
    <script src="./uno.config.js"></script>
    <!-- UnoCSS Attributify {@link 文档 https://uno.antfu.me} {@link https://github.com/unocss/unocss/tree/main/packages/runtime} -->
    <script src="https://cdn.jsdelivr.net/npm/@unocss/runtime@0.51.13/attributify.global.min.js"></script>

    <!-- IconifyIcon {@link https://github.com/iconify/iconify} -->
    <script src="https://cdn.jsdelivr.net/npm/iconify-icon@1.0.7/dist/iconify-icon.min.js"></script>

    <!-- User Style -->
    <link rel="stylesheet" href="./src/styles/main.css" />
    <!-- User Utils -->
    <script src="./src/utils/index.js"></script>
  </head>

  <body m0>
    <div id="app" v-cloak un-cloak />
  </body>

  <script>
    const { createApp } = Vue
    const { createPinia } = Pinia

    createApp(
      loadVueFile('./src/pages/hi.vue', {
        importmap: {
          '~/': './src/'
        }
      })
    )
      .use(createPinia())
      .mount('#app')
  </script>
</html>