我需要一个报警器的前端来接收 vps 的报警信号，这里使用 electron + Vue 来开发，Vue 已经升级为 3.0，但是并不像把这件事搞的太复杂，本来是一个小项目，不需要 typescript，es6 即可。在考察了几个界面库后，果断选择 quasar， 虽然是 material design 风格，但是胜在组件库全。

安装 nvm

scoop install nvm
cd /d C:\Users\%USERNAME%\scoop\apps\nvm\current
nvm install lts

				

					
				
				

					
				
				

					
				
				

					
				
			

创建一个 node-shell.bat

@echo off
cd /d "%~dp0" 
@path=C:\Users\%USERNAME%\scoop\persist\nvm\nodejs\v18.16.0;%path%
::CALL "%~dp0\setenv.bat"
C:
cd /d "%~dp0"
 
START "Node.js Environment" cmd

				

					
				
				

					
				
				

					
				
				

					
				
			

运行起来安装包管理器

 
npm install --global yarn
npm install -g pnpm

				

					
				
				

					
				
				

					
				
				

					
				
			

创建项目

yarn create quasar

				

					
				
				

					
				
				

					
				
				

					
				
			

选择 Sass、javascript、Vite，和 ESLint。

创建自己的应用程序图标

yarn global add @quasar/icongeni

				

					
				
				

					
				
				

					
				
				

					
				
			

yarn config set sass_binary_site https://registry.npmmirror.com/mirrors/node-sass 
yarn config set electron_mirror https://registry.npmmirror.com/mirrors/electron/ 

				

					
				
				

					
				
				

					
				
				

					
				
			

安装 electron 模块

.\node_modules\.bin\quasar mode add electron

				

					
				
				

					
				
				

					
				
				

					
				
			

编写代码并运行测试

.\node_modules\.bin\quasar dev -m electron

				

					
				
				

					
				
				

					
				
				

					
				
			

打包

.\node_modules\.bin\quasar build -m electron -d

				

					
				
				

					
				
				

					
				
				

					
				
			

先开发在线版，不需要 electron

程序比较简单，不想使用繁琐的 typescript，所以 yarn create quasar 后选择 Javascript，另外不使用 axios，会使用 fetch。