1、官网
2、配置PowerShell执行策略
以管理员身份运行PowerShell,运行Set-ExecutionPolicy RemoteSigned
,并输入Y,回车确认
3、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
安装上下方向键切换选择,回车键确认选择
- What would you like to build?
选择第一项:App with Quasar CLI, let's go! - spa/pwa/ssr/bex/electron/capacitor/cordova
- Project folder:
项目文件夹名称:默认名称,直接回车 - Pick Quasar version:
选择Quasar的版本:Quasar v2 (Vue 3 | latest and greatest) - recommended
,默认选择v2版本,直接回车 - Pick script type:
选择JS还是TS:Javascript
,默认选择js,直接回车 - Pick Quasar App CLI variant:
选择Webpack还是Vite:Quasar App CLI with Vite
,按方向键下键切换选择,选Vite
,回车 - Package name:
包名:默认名称,直接回车 - Project product name: (must start with letter if building mobile apps)
项目产品名称:(构建移动端必须以字母开头):默认名称,直接回车 - Project description:
项目描述:默认描述,直接回车 - Author:
作者:输入自己的名字加邮箱,回车 - Pick your CSS preprocessor:
CSS框架:Sass with SCSS syntax
,默认选择,直接回车 - Check the features needed for your project:
其他特性:ESLint
,默认选择,直接回车 - Pick an ESLint preset:
ESLint设置:Prettier - https://github.com/prettier/prettier
,默认选择,直接回车 - 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
即可。