Windows下Scratch3.0二次开发笔记

注意：
1. 使用第三方源，可能会找不到模块，如果已使用请使用下面命令切换回官方的源
npm config set registry http://www.npmjs.org
有条件的尽量挂个V·P·N
2. 如果npm install失败多尝试几次
3. 建议在Linux环境下编译，成功率很高，Win10下使用linux子系统编译和二次开发Scratch3.0请参考：https://www.213.name/archives/1739
4.

下载

nodejs
https://nodejs.org/en/

scratch3.0源码
https://github.com/LLK/scratch-gui

编译

npm install
npm build

若报错后按以下步骤重新编译

进入项目文件夹，删除package-lock.json，执行
npm cache clear --force
进入C:\Users\Administrator\AppData\Roaming\npm-cache，执行
npm cache clear --force

二次开发

将VM暴露出来
修改gui.jsx

componentDidMount () {
        setIsScratchDesktop(this.props.isScratchDesktop);
        this.setReduxTitle(this.props.projectTitle);
        this.props.onStorageInit(storage);
        initVM(this.props.vm); //将VM暴露出来
    }

最外层html

  window.VM = null;//虚拟机
  //初始化虚拟机
  function initVM(vm) {
    window.VM = vm;
  }

  //是否初始化完毕
  VM.initialized

//加载项目
  window.fetchSBFile=function(url) {
    console.log(`%cfetchSBFile ${url}`, 'color:red');

    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, true);
    xhr.responseType = 'arraybuffer';

    xhr.onload = function() {
        if (200 == this.status) {
            var blob = new Uint8Array(this.response);
            window.VM.loadProject(blob);
        }
    };
    xhr.send();
  }

  //获取sb3
    function submitHomeWork(){
        if(VM != null){
            //保存成sb3文件提交上传
      var file = VM.saveProjectSb3();
      file.then(function(res){
        console.log(res)
      });
        }
    }

  //获取截图
  function submitScreen(){
    if(VM != null){
      //拿到Canvas的图像
      var canvas = VM.renderer.canvas;
      var imgData = canvas.toDataURL("image/webp"); //base64
      return base64Img2Blob(imgData);
    }
  }

  function base64Img2Blob(code){
    var parts = code.split(';base64,');
    var contentType = parts[0].split(':')[1];
    var raw = window.atob(parts[1]);
    var rawLength = raw.length;
    var uInt8Array = new Uint8Array(rawLength);
    for (var i = 0; i < rawLength; ++i) {
      uInt8Array[i] = raw.charCodeAt(i);
    }
    return new Blob([uInt8Array], {type: contentType}); 
  }

  //发送键盘事件
  VM.postIOData('keyboard', {
      keyCode: 37,
      key: 'ArrowLeft',
      isDown: true
  });
  //开始
  VM.greenFlag();
  //停止
  VM.stopAll();
  //清理虚拟机
  VM.clear();

开源版scratch3.0

Scratch3.0二次开发版，封装了常用的功能，开封即用。
https://github.com/open-scratch/scratch3

scratch开发者群，相关资源及软件可在群内下载

244050817
244051003 （已满）