quasar搭建,运行,打包

该文详细介绍了如何搭建Quasar应用开发环境,包括设置PowerShell执行策略、安装VSCode、使用nvm管理Node.js版本、安装yarn和@quasar/cli,然后创建Quasar项目,选择项目配置,最后添加Electron模式并进行应用打包。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、官网

quasar中文网quasar英文网

2、配置PowerShell执行策略

以管理员身份运行PowerShell,运行Set-ExecutionPolicy RemoteSigned,并输入Y,回车确认

3、VSCode

安装VSCode

4、安装nvm

访问下载地址下载安装nvm:
百度云分享
官网直装链接
nvm的github发行界面下载nvm-setup.exe
GitCode镜像下载nvm-setup.exe(登录获取下载链接,下载链接还是Github的,唯一的作用就是挑选版本的时候快点)

5、配置nvm

nvm install lts安装最新版本的Node.js,本文安装的是18.16.0
nvm install lts启用这个版本
运行cmd /c "nvm -v && node -v && npm -v",正常输出版本号说明安装完成

6、安装yarn

npm install --global yarn

7、安装@quasar/cli

yarn global add @quasar/cli

8、创建一个Quasar应用程序

yarn create quasar

安装上下方向键切换选择,回车键确认选择

  1. What would you like to build?
    选择第一项:App with Quasar CLI, let's go! - spa/pwa/ssr/bex/electron/capacitor/cordova
  2. Project folder:
    项目文件夹名称:默认名称,直接回车
  3. Pick Quasar version:
    选择Quasar的版本:Quasar v2 (Vue 3 | latest and greatest) - recommended,默认选择v2版本,直接回车
  4. Pick script type:
    选择JS还是TS:Javascript,默认选择js,直接回车
  5. Pick Quasar App CLI variant:
    选择Webpack还是Vite:Quasar App CLI with Vite,按方向键下键切换选择,选Vite,回车
  6. Package name:
    包名:默认名称,直接回车
  7. Project product name: (must start with letter if building mobile apps)
    项目产品名称:(构建移动端必须以字母开头):默认名称,直接回车
  8. Project description:
    项目描述:默认描述,直接回车
  9. Author:
    作者:输入自己的名字加邮箱,回车
  10. Pick your CSS preprocessor:
    CSS框架:Sass with SCSS syntax,默认选择,直接回车
  11. Check the features needed for your project:
    其他特性:ESLint,默认选择,直接回车
  12. Pick an ESLint preset:
    ESLint设置:Prettier - https://github.com/prettier/prettier,默认选择,直接回车
  13. Install project dependencies? (recommended)
    包管理器:Yes, use yarn,默认选择,直接回车

9、进入项目

cd .\quasar-project\

10、运行

yarn quasar dev
在这里插入图片描述

11、添加electron模式

npx quasar mode -a electron

12、打包

cmd /c "set ELECTRON_MIRROR=https://npmmirror.com/mirrors/electron/&& npx quasar build -m electron"
等待加载

生成位置:quasar-project\dist\electron\Packaged\Quasar App-win32-x64
运行Quasar App.exe即可。



请添加图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值