1-搭建环境和创建简单的应用程序
778
0
2023-07-02
2023-07-18
Hey、小怪兽
- • 这里默认已经安装了vscode，pnpm，git，如果没有安装的话百度安装一下：
- • 找一个干净的文件夹，要全英文路径的，我的是：E:\projects\git-taropet\demo
- • 如果安装了vscode后，在这个文件夹里随便一个空白的地方，右键-通过code打开，如果没有这个选项的话，在这个文件的地址栏：
- • 输入cmd，按下回车键：
- • 输入code .（注意这里code后面是一个空格和一个点）：
- • 接着就打开了vscode，在上方点击终端-新建终端：
- • 选择Git Bash：
- • 输入pnpm -v可以看自己的pnpm版本号：
-
pnpm -v 8.5.1 - • 初始化项目：
-
pnpm init - • 会看到多了一个package.json的文件：
-
{ "name": "demo", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "keywords": [], "author": "", "license": "ISC" } - • 安装Electron，这个是开发桌面端应用的，这里指定了24.3.1的版本，因为我安装25的不知道为啥一直卡着：
-
pnpm add --save electron@24.3.1 - • 安装完毕后，package.json会多出三行：
-
"dependencies": { "electron": "24.3.1" } - • 下面需要加上一个启动项目的命令，在scripts里加一行，注意test最后面要加个逗号：
-
"scripts": { "test": "echo \"Error: no test specified\" && exit 1", "start": "electron ." }, - • 接着就可以启动项目了，在终端输入：
-
pnpm start - • 如果是这样的报错，说明刚才的package.json没有保存，用Ctrl+S保存：
- • 按理来说是这样的报错：
- • Electron有主进程和渲染进程，还有连接这两个进程的预加载脚本，package.json里的main就是主进程的位置：
-
"main": "index.js", - • 但是项目的目录下并没有index.js，创建一个就可以了：
- • 在index.js随便写一个console.log：
-
console.log('Hello Taro!') - • 再次在终端pnpm start：
- • 非常完美，这样第一个简单的Electron应用程序就写好了！
- • 完整的package.json代码：
-
{ "name": "demo", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "start": "electron ." }, "keywords": [], "author": "", "license": "ISC", "dependencies": { "electron": "24.3.1" } }