文章

创建Vue3工程

发布:2025年04月20日 更新:2025年04月20日 40


Vue官方文档:快速上手


确保安装了最新版本的 Node.js,并且当前工作目录正是打算创建项目的目录。在命令行中运行以下命令

npm create vue@latest

这一指令将会安装并执行 create-vue,它是 Vue 官方的项目脚手架工具。将会看到一些诸如 TypeScript 和测试支持之类的可选功能提示:

✔ Project name: … <your-project-name>
✔ Add TypeScript? … No / Yes
✔ Add JSX Support? … No / Yes
✔ Add Vue Router for Single Page Application development? … No / Yes
✔ Add Pinia for state management? … No / Yes
✔ Add Vitest for Unit testing? … No / Yes
✔ Add an End-to-End Testing Solution? … No / Cypress / Nightwatch / Playwright
✔ Add ESLint for code quality? … No / Yes
✔ Add Prettier for code formatting? … No / Yes
✔ Add Vue DevTools 7 extension for debugging? (experimental) … No / Yes

Scaffolding project in ./<your-project-name>...Done.


如果不确定是否要开启某个功能,可以直接按下回车键选择 No。在项目被创建后,通过以下步骤安装依赖并启动开发服务器:

cd <your-project-name>
npm install
npm run dev


现在应该已经运行起来了第一个 Vue 项目!请注意,生成的项目中的示例组件使用的是组合式 API 和 <script setup>,而非选项式 API。下面是一些补充提示:


当准备将应用发布到生产环境时,请运行:

npm run build

此命令会在 ./dist 文件夹中为应用创建一个生产环境的构建版本。关于将应用上线生产环境的更多内容,请阅读生产环境部署指南


文章部分内容来源于网络,如果侵犯了您的权益,请联系 3079767097@qq.com 删除