Quick start

Warning

注意，该栏资料仅适用于需要对软件核心功能进行开发与调整的社区开发者与第三方开发者。过程涉及开发环境搭建，源代码编译等复杂操作，没有对软件底层核心功能修改的需求无需参考此资料。

开发环境¶

请确保你的计算机已经安装好了以下软件或工具。

Node.js > 8 (推荐使用版本14，过高的Node版本在某些情况下也会导致编译失败)
python2.7
git
Java
根据 node-gyp官方说明安装必要的本地编译工具

克隆&安装¶

克隆所有工程核心仓库。 (使用--depth 指令来避免下载全部的仓库历史内容，否则GUI的大小将会超过1.18GB)

mkdir openblock
cd openblock
git clone --depth 3 https://github.com/openblockcc/openblock-gui
git clone https://github.com/openblockcc/openblock-link
git clone https://github.com/openblockcc/openblock-resource

安装

使用 install 指令下载所有必要的npm包，并运行 fetch 指令下载所有远程资源

cd openblock-gui
npm install
cd ..
cd openblock-link
npm install
npm run fetch
cd ..
cd openblock-resource
npm install
npm run fetch
cd ..

运行¶

启动硬件接口服务器 openblock-link
```
cd openblock-link
npm start
```
启动外部插件与设备服务器 openblock-resource

在新的一个终端中执行。
```
cd openblock-resource
npm start
```
启动 openblock-gui

在新的一个终端中执行。
```
cd openblock-gui
npm run start-open
```
在 openblock-gui 的 webpack 构建完成后，将会有弹出 openblock-gui 的网页。当然你也可以通过手动输入地址 http://127.0.0.1:8601/ 来访问。

构建完整的开发环境¶

在前面的步骤中我们已经成功编译启动了 openblock 软件，但是在过程中我们使用的软件包均为社区在 npm 上发布的软件包，若是我们想要修改其中的源代码，我们仍需要构建一个更完整的软件开发环境。下面就来介绍一些你在构建自己版本的软件过程中需要了解的内容。

获取全部的核心软件包¶

克隆 openblock-blocks 与 openblock-vm，关于这些软件包各自的作用，你可以阅读构架介绍来了解。

git clone --depth 3 https://github.com/openblockcc/openblock-blocks
git clone --depth 3 https://github.com/openblockcc/openblock-vm

安装和链接

link 指令会以本地npm包替换项目内默认的包，这样你在 openblock-blocks 等包中的修改才会被 openblock-gui 使用，否则它默认使用的将会是从npm服务器下载的内容，你可以查看 openblock-gui/node_modules 下的 openblock-blocks 与 openblock-vm 的文件夹，如果 link 成功，那么他们将被链接到本地克隆下来的工程的位置。
```
cd openblock-blocks
npm install
npm link
cd ..
cd openblock-vm
npm install
npm link
cd ..
cd openblock-gui
npm install
npm link openblock-blocks openblock-vm
cd ..
```

Tip

在 openblock-gui 工程下使用 npm start或 npm run start-open 启动 webpack 服务器后，webpack 会持续监听工程内的源代码变动，包括 link 的软件包内的代码，也就意味着你在修改 openblock-gui 或是 openblock-vm 中的代码后只需要保存文件，就会触发 webpack 重新编译与更新页面，这个过程的耗时要比 webpack 重启编译短很多，调试代码时很方便。

Attention

对于 openblock-blocks 来说，由于其编译模式的特殊 (使用 google-closure-compiler 编译)，在修改其内部代码后我们不仅要在其路径下执行 npm run prepublish 重新编译代码，还需要重启 gui 的 webpack 服务器才能使变动生效。

二次开发过程¶

在上一步骤中，我们链接了全部的核心软件包，大部分需要二次修改的代码都包含在里面了。实际开发时我们可以根据二次修改的需要取消加减这些包，根据实际需要只 link 需要修改的软件包内容即可。一般来说，推荐大家使用一个独立的文件夹来作为 OpenBlock 的工作文件夹，如下所示：

workspace

在日常的工作中中我们都是使用这套环境和步骤来进行功能开发与调试的，启动 gui，link 与 extension 三个服务器，而后修改代码。在最终确认完成后，再转到 desktop 工程下进行打包发布。