Easy-Scratch3 开源项目教程

Easy-Scratch3 开源项目教程

easy-scratch3Easy Scratch封装了如上传、加载、菜单配置、云变量接口、自定义素材库等常用的功能。只需简单js基础，即可轻松对接到平台上。You can easy embed scratch to your website with config and javascript项目地址:https://gitcode.com/gh_mirrors/ea/easy-scratch3

1. 项目的目录结构及介绍

Easy-Scratch3 是一个基于 Scratch 3.0 的开源项目，旨在简化 Scratch 的使用和部署。以下是项目的目录结构及其介绍：

easy-scratch3/
├── assets/
│   ├── images/
│   └── sounds/
├── config/
│   └── default.json
├── docs/
│   └── README.md
├── src/
│   ├── blocks/
│   ├── extensions/
│   └── gui/
├── package.json
├── README.md
└── server.js

• assets/: 包含项目所需的所有静态资源，如图片和声音文件。
• config/: 包含项目的配置文件，如 default.json。
• docs/: 包含项目的文档文件，如 README.md。
• src/: 包含项目的源代码，包括块定义、扩展和图形用户界面。
• package.json: 项目的 npm 配置文件，包含依赖项和脚本。
• README.md: 项目的主文档文件，包含项目的基本信息和使用说明。
• server.js: 项目的启动文件，用于启动服务器。

2. 项目的启动文件介绍

项目的启动文件是 server.js，它负责启动服务器并加载 Scratch 3.0 环境。以下是 server.js 的主要功能：

const express = require('express');
const path = require('path');
const app = express();

// 设置静态文件目录
app.use(express.static(path.join(__dirname, 'src/gui')));

// 启动服务器
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
  console.log(`Server is running on port ${PORT}`);
});

• 引入依赖: 使用 require 引入 express 和 path 模块。
• 设置静态文件目录: 使用 express.static 设置静态文件目录为 src/gui。
• 启动服务器: 使用 app.listen 启动服务器，默认端口为 3000。

3. 项目的配置文件介绍

项目的配置文件位于 config/default.json，它包含了项目的基本配置信息。以下是 default.json 的内容示例：

{
  "server": {
    "port": 3000
  },
  "scratch": {
    "extensions": ["pen", "videoSensing"]
  }
}

• server: 包含服务器配置，如端口号。
• scratch: 包含 Scratch 配置，如启用的扩展。

通过修改 default.json 文件，可以调整服务器的端口号和启用的 Scratch 扩展。

easy-scratch3Easy Scratch封装了如上传、加载、菜单配置、云变量接口、自定义素材库等常用的功能。只需简单js基础，即可轻松对接到平台上。You can easy embed scratch to your website with config and javascript项目地址:https://gitcode.com/gh_mirrors/ea/easy-scratch3