我通过引导项目内容然后构建它以进行部署来编写（业余）Vue3 应用程序(*)。效果很好。
我需要创建一个可以直接在浏览器中加载的独立的单个 HTML 页面。几年前，当我开始使用 Vue 时（在 v1 → v2 的过渡期间），我曾经这样做过，当时我立即找到了正确的文档。
我找不到类似的 Vue3 和 Composition API。
什么是一个框架页面，它将显示值反应变量 {{hello}} （我将在完整的构建应用程序的上下文中在 <script setup> 中定义）
这就是我过去的做法（我希望我做对了）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://unpkg.com/vue@2"></script>
</head>
<body>
<div id="app">
{{hello}}
</div>
<script>
// this is how I used to do it in Vue2 if I remember correctly
new Vue({
el: '#app',
data: {
hello: "bonjour!"
}
// methods, watch, computed, mounted, ...
})
</script>
</body>
</html>
(*)我实际上使用Quasar框架，但这并没有改变我问题的核心。
P粉6337331462024-03-27 11:03:40
但是您可以在页面脚本中使用设置挂钩，如下所示：
const {
createApp,
ref
} = Vue;
const App = {
setup() {
const hello = ref('Bonjour')
return {
hello
}
}
}
const app = createApp(App)
app.mount('#app')
sssccc{{hello}}