教程:Nodejs大漠插件开发游戏脚本实战(二)搭建项目

一、使用nvm-windows安装Nodejs

上一篇文章我们说过我们需要用到32位的Nodejs,而且因为一些特殊原因,我们要用到指定的版本。为了不影响我们其他项目的开发,这里用到一个Nodejs的版本管理工具nvm-windows,我们直接下载发行版中的nvm-setup.zip解压安装即可。

随后我们打开命令行,输入

nvm install 12.18.3 32

nvm会自动帮我们安装32位的nodejs以及对应版本的npm,然后我们切换到这个版本

nvm use 12.18.3 32

二、使用git克隆Electron项目

1.脚手架

用到的是一个vite+electron的脚手架vite-electron-quick,我们直接点击下载代码,然后复制https中的url
在这里插入图片描述

2.克隆项目

因为国内网络环境问题,我们使用源地址克隆项目可能非常难受。有很多方案可以解决这个问题,我讲一下我常用的两个方法,一是让终端走代理,具体自己查一下,有机会的话会顺带提一提;这里我用一个最简便的方法,但是这个方式最适合克隆一些开源项目,仅以下载为目的的项目。

我们在项目目录中打开终端,粘贴项目的http地址,然后在域名后面加上 .cnpmjs.org 使用我们的cnpm镜像源去克隆

git clone https://github.com.cnpmjs.org/MangoTsing/vite-electron-quick.git
3.安装依赖
cd ./vite-electron-quick
npm install
4.运行项目
npm run dev

三、修改项目架构

1.移除原有git信息

在项目下,通过命令显示隐藏文件夹

ls -a

删除 .git 文件夹

rm .git -force -r
2.目录结构

使用Visual Studio Code打开项目,我们可以看到 /src 文件夹下有两个文件夹mainrender
在这个项目下,
main 分配的是Electron的主进程,也就是我们写Nodejs的地方
render 分配的是渲染进程,写Vue的地方

3.lib文件夹

为了我们的打包正常,我们需要在做两个调整。

(1) 设置Electron不打包的文件夹

在main下面,新建一个文件夹,我愿意将他命名为library。用于存放我们的大漠插件dll、字库、图库、Redis或者其他不能被Electron打包的文件
随后我们打开项目根目录下的package.json文件,在build下新增一个属性

{
    "build":{
        ...其他属性...
        "extraResources":{
            "from":"./src/main/library/",
            "to":"library"
        },
        ...其他属性...
    }
}
(2) 设置Electron不打包的node模块

在配置Electron build的时候,我们只需要把前端的node_modules打包就可以了,而把主线程用到的模块打包的话,往往会造成模块的引用出错,我们修改一下package.jsonbuild节点下,修改files一项

{
    "build":{
    	...其他属性...
        "files":[
            "logo.ico",
            "node_modules",
            "dist/main/**",
            "dist/render/**",
            "!node_modules/vue",
            "!node_modules/vue-router"
        ],
        ...其他属性...
    }
}

四、随笔

第一个想说的。这个教程很大可能会有视频。因为我尝试了一下,录制视频的精力还是有的(剪辑就不一定了,视频录制好我会上传到B站随后加到本文末尾)。
把东西写出来才发现,如果要做到通俗易懂,兼顾小白的话,需要补充的知识或者额外内容实在是非常多。非常有可能会在一些没经验的小步骤上卡点。通常这种情况都是通过一个交流群去帮助小伙伴解答问题。所以我也会在这个教程完成之后建一个Electron的交流群,到时候欢迎大家的加入。

第二个想说的。为什么拖了这么久才开始写项目搭建。其实这个教程的技术含量低,我的水平也不高,更多的是一些细节跟踩坑,而且因为没有好的需求促使我去开发,所以我对游戏脚本的热情逐渐褪去,加上Electron单线程的性能多多少少有点拉跨,所以一开始本来打算放弃这个教程的。
又下决心来做一个是因为B站跟本站几个小伙伴催更,二来我觉得就算是简单简陋的教程,也是对自己技术的一个记录,从简单的开始,增加自己的输出未尝不是一件好事,所以我觉得继续做完这个教程。
毕竟不忘初心,方得始终

教程:Nodejs大漠插件开发游戏脚本实战(二)搭建项目

评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

happy_plus

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值