编译scratch3.0桌面程序(根据原创进行了一点修改)

编译scratch3.0桌面程序

1.首先操作系统是win10;
2.安装好node.js,yarn,git;
3.在github上下载scratch-gui和scratch-desktop的源代码,不需要用git clone的方式(下载全部源代码,太繁琐),直接下载zip压缩包即可;

编译scratch3.0桌面程序(根据原创进行了一点修改)_第1张图片
编译scratch3.0桌面程序(根据原创进行了一点修改)_第2张图片
4.解压下载的文件
编译scratch3.0桌面程序(根据原创进行了一点修改)_第3张图片
5.首先cmd 进入scratch-gui-develop,依次运行如下命令
(1)git checkout scratch-desktop
//切换分支的意思,在scratch-gui里面还存在scratch-desktop分支后面需要将scratch-gui的dist文件部署到scratch-desktop上。
(2) npm install
//下载依赖
(3) yarn
//还是下载依赖(只为求个心安,记住千万不要使用cnpm,真的是坑爹,反正我用cnpm,他老说我缺少相关文件,可能是下载的依赖包不全,搞了好多遍都是这样)
(4)yarn build
(5)yarn start
编译scratch3.0桌面程序(根据原创进行了一点修改)_第4张图片
打开浏览器127.0.0.1:8601即可进入sratch的浏览器界面
编译scratch3.0桌面程序(根据原创进行了一点修改)_第5张图片
6.接着在这个scratch-gui的目录下将继续执行
BUILD_MODE=dist npm run build 命令
(如果不行就试试set BUILD_MODE=dist&& npm run build,我是运行前面的那一个,后面的这一个我运行有问题,问题出在哪我也不知道)。
成功之后会在该目录生成dist目录,该目路下的js文件就可以在别的项目中引用了(比如:scratch-desktop)

——————OK,scratch-gui告一段落。

7.接着cmd 进入scratch-desktop目录(win10系统)
依次运行下面的命令
yarn
npm install
npm run fetch //拉取相关图片资源
拉取完资源之后你会在scratch-desktop/node_modules/目录下看到scratch-gui/目录
将第6步的dist文件夹拷贝到该目录下,然后运行如下命令:
npm start
成功之后就是下面的样子了:
编译scratch3.0桌面程序(根据原创进行了一点修改)_第6张图片
并且在目录下也生成了dist目录
编译scratch3.0桌面程序(根据原创进行了一点修改)_第7张图片
接着再运行这个命令
npm run dist //制作打包的版本
或者
npm run dist:dir //模拟打包就是半打包
编译scratch3.0桌面程序(根据原创进行了一点修改)_第8张图片

点击exe应用程序就是这样,但是却找不到图片资源,我猜测可能是图片路径不对,所以需要该一下图片路径,当然我也正在寻找图片路径在哪?有找到的小伙伴请在我的博客下方留言,谢谢。

编译scratch3.0桌面程序(根据原创进行了一点修改)_第9张图片
所有步骤我知道的全部都分享给大家了,这是根据我的一位朋友写的笔记进行实际操作后修改的,不算是原创。由于种种原因,现已不再研究scratch了,祝还在这条路上拼搏的各位马到成功。

你可能感兴趣的:(适合初学者,sratch3.0)