只需两个简单的步骤,几分钟之内,你就可以通过 Quasar 的 CLI 开始运行一个功能齐全的 Vue 应用程序。这个应用程序采用最先进的最佳实践构建,并配备了 Quasar 强大的 UI 组件库。
TIP
如果你是一个更有经验的 Vue 开发者,我们建议你先在所有 Quasar 版本之间做出选择。
前提条件
确保你的机器上安装了 Node.js >= 22(或任何更新的 LTS Node.js 版本)以及 NPM v6+ 或 Yarn v1(经典版)或 PNPM v8+ 或 Bun。请不要使用任何奇数版本的 Node.js,因为这些版本被视为实验性的。
步骤 1:创建项目
先导航到你想要存放项目的上级目录。Quasar 稍后会提示你输入项目文件夹名称,并在当前目录下创建该文件夹。
输入以下命令:
$ yarn create quasar在运行上述命令时,你会看到一些选项提示。根据你的需求,你可以选择 CLI 类型(Vite 或 Webpack)、TypeScript 支持或不同的 CSS 预处理器。如果你对任何选项不确定,只需接受默认值(按回车键)即可。除了 CLI 类型外,你以后可以随时更改这些选项。
可选 - 安装全局 CLI
要使用 Quasar 的更多功能,建议安装全局 CLI。有了它,你可以:
- 直接在终端中运行 Quasar 命令
- 运行本地 HTTP 服务器进行测试
- 对项目进行升级
$ yarn global add @quasar/cli步骤 2:开始开发
进入新创建的项目文件夹,并运行 Quasar CLI 命令来启动开发服务器:
# 如果你安装了全局 CLI:
$ quasar dev
# 否则:
$ yarn run dev
# 运行本地 Quasar CLI 命令:
$ yarn quasar dev你会看到开发服务器正在编译你的新应用程序。一旦完成,你的新应用程序应该会在浏览器中自动打开。就是这样!现在你可以使用你喜欢的 IDE/代码编辑器来开发你的应用程序了。
接下来做什么?
根据你的经验水平,我们有以下建议:
初学者 Vue JavaScript 开发者
我们强烈建议学习 Vue,掌握 Vue 的基础知识对于使用 Quasar 非常重要。
中级 Vue 开发者
建议你熟悉:
- Quasar 的目录结构
- 不同的构建模式
- 从 SSR 开始(你刚刚构建的项目是一个 SPA)
高级 Vue 开发者
如果你想在 Quasar CLI 之外的不同场景中使用 Quasar,请查看不同的 Quasar 版本。或者,如果你想继续使用 Quasar CLI,请查看: