Scratch-Blockly配置过程

原文地址：https://blog.csdn.net/litianquan/article/details/82735876

Scratch-Blockly配置过程

由于Blockly案例库开发项目需添加Scratch Blocks的相关内容，故结合Github上开源项目，进行Scratch Blocks相关环境的配置。如果你想对Scratch Blocks有进一步的了解，或者想在自己的电脑或服务器上搭建Scratch Blocks的环境，供教学和研究使用，您可以参照下面的内容，进行Scratch Blocks相关环境的配置。整个环境由3部分组成，分别是scratch-vm, scratch-blocks和scratch-gui。

Scratch Blocks

整个环境由3部分组成，分别是scratch-vm, scratch-blocks和scratch-gui。

【注】

1. 配置过程中个别指令可能需要管理员(root)权限，为避免切换，整个过程最好是在管理员(root)用户下进行操作；
2. 该配置过程中的指令是在Ubuntu环境下完成的，Windows和MacOS与此相似，可自行探索尝试；

1. 准备工作

/* git, npm, nodejs工具准备 */

/* Linux下安装指令 */

sudo apt-get install npm

sudo apt-get install nodejs

sudo apt-get install git

/* 对版本要求较高，需升级 */

npm install -g npm /* npm升级到最新版本 */

npm install -g n /* nodejs升级 */

n stable /* 升级到最新的稳定版本 */

mkdir scratch /*便于管理，新建一个文件夹存放*/

cd scratch

git clone https://github.com/llk/scratch-gui /*scratch-gui下载*/

git clone https://github.com/llk/scratch-vm /*scratch-vm下载*/

git clone https://github.com/llk/scratch-blocks /*scratch-blocks下载*/

2. Scratch-VM的配置

1. cd scratch-vm
2. npm install
3. npm link
4. npm run watch

在执行"npm run watch"时，会停留在"+4 hidden modules"这个位置，不需要久等，直接Ctrl+C终止程序进行下面的配置即可。

3. Scratch-Blocks的配置

 

cd ../scratch-blocks

npm install

npm link

 

4. Scratch-GUI的配置

cd ../scratch-gui

npm install

npm link scratch-vm scratch-blocks

npm install

npm start

5. 打开浏览器，在地址栏中输入 0.0.0.0:8061即可访问Scratch-Blocks，即Scratch 3.0界面。

Scratch 3.0 or Scratch Blocks

至此，Scratch-Blocks的配置就完成了。

目前Scratch Blocks还处于开发阶段，我们搭建的其实是测试版或预览版，所以很多功能还在开发中，包括语言切换等，后续我也会持续关注和更新。