全部学科
Python全栈
python
NodeJS全栈
nodejs
小程序首页
📅 2026-05-20 6 分钟 ✍️ juanwangdev

项目创建

Vue 3 项目推荐使用 Vite 作为构建工具,启动快速且支持开箱即用的开发体验。

使用 Vite 创建项目

命令行创建

Bash
npm create vue@latest my-project

交互式提示中可选择:

  • TypeScript 支持
  • Vue Router
  • Pinia 状态管理
  • ESLint / Prettier
  • 单元测试(Vitest)

安装依赖并启动

Bash
cd my-project
npm install
npm run dev

项目结构

JavaScript
my-project/
├── src/
│   ├── assets/          # 静态资源
│   ├── components/      # 组件文件
│   ├── router/          # 路由配置
│   ├── stores/          # 状态管理
│   ├── App.vue          # 根组件
│   └── main.js          # 入口文件
├── index.html           # HTML 模板
├── vite.config.js       # Vite 配置
└── package.json         # 项目依赖

入口文件解析

text
// main.js
import { createApp } from 'vue'
import App from './App.vue'

createApp(App).mount('#app')

createApp 创建应用实例,mount 挂载到指定 DOM 元素。

Vue 3 不再强制使用 new Vue() 的构造函数形式,统一采用 createApp API。

要点总结

  • 使用 npm create vue@latest 创建项目
  • Vite 是官方推荐的构建工具
  • 入口文件通过 createApp().mount() 启动应用

📝 发现内容有误?点击此处直接编辑

← 上一篇 Vue简介
下一篇 → v-bind动态class与style
想查看更多题目和详细解析?
小程序提供完整的题库、模拟考试和详细解析
马上就来

长按或扫描二维码,立即体验

扫码体验小程序
马上就来
使用微信扫描二维码
立即体验完整题库