在 weapp-vite 中使用 Vue SFC
weapp-vite 内置了 Vue SFC 编译链路，配合 wevu 运行时即可用 Vue 风格开发小程序页面/组件，同时保持小程序能力（页面特性、分享、性能优化）。
适用版本：Vue SFC 仅在
[email protected]及以上可用，请先升级到 6 大版本。
快速开始
- 需要安装
wevu（任意包管理器均可add/install wevu）。 - 官方模板已默认带上，手动集成时请先装依赖再继续。
心智模型
Vue SFC 在小程序里建议拆成两段：
- 编译期（weapp-vite）：负责把
.vue拆解/编译为小程序产物（WXML/WXSS/JS/JSON），并做模板语法（如v-if/v-for/v-model）到 WXML 的转换。 - 运行期（wevu）：负责响应式、生命周期 hooks、快照 diff 与最小化
setData，让你用 Vue 3 风格的 Composition API 写业务逻辑。
mermaid
flowchart LR
A[Vue SFC<br/>.vue] --> B[编译期<br/>weapp-vite]
B --> C[小程序产物<br/>WXML / WXSS / JS / JSON]
C --> D[运行期<br/>wevu]
D --> E[小程序逻辑层<br/>响应式 / hooks / diff + setData]
E --> F[渲染层更新<br/>UI]