如何在普通html页面中使用petite vue，并使用setup，mounted方法

要在普通的 HTML 页面中使用 Petite Vue，需要先引入 Petite Vue 库和 Vue 库。可以在 head 标签中添加以下代码：

<script src="https://unpkg.com/vue@next"></script>
<script src="https://unpkg.com/petite-vue@next"></script>

接下来，可以在 body 标签中添加一个容器元素来渲染 Petite Vue 实例：

<div id="app"></div>

然后，在一个 script 标签中定义 Petite Vue 实例。在这个实例中，可以使用 `setup()` 函数来定义组件的行为，使用 `mounted()` 方法来在组件挂载时执行一些代码。

<script>
  const app = {
    setup() {
      // 定义组件行为
    },
    mounted() {
      // 组件挂载时执行的代码
    }
  };
  PetiteVue.createApp(app).mount('#app');
</script>

在 `setup()` 函数中，可以使用 Vue 3 的 Composition API 来定义组件行为。例如，可以使用 `ref` 函数来定义响应式变量：

<script>
  const app = {
    setup() {
      const count = Vue.ref(0);
      return {
        count
      };
    },
    mounted() {
      console.log('Component mounted');
    }
  };
  PetiteVue.createApp(app).mount('#app');
</script>

在这个例子中，定义了一个名为 `count` 的响应式变量，初始值为 0。在组件挂载时，会打印一条消息到控制台。

注意，Petite Vue 目前还处于 beta 阶段，API 可能会有所变化。