项目搭建 第二
项目搭建 第二
正如叙言所说,Blockly
仅充当项目中的一个组件。因而虽谓搭建项目,实则是根据已有项目挑选恰当方式引入 Blockly
类库。
下有官方示例,包括 Vue
、npm
、WebPack
等等示例项目。
https://github.com/google/blockly-samples/tree/master/examples
由于将 Blockly
嵌入项目的方式实在太多,此处不便展开,故不再赘述。足下请按图索骥,自行查看示例项目,并引入 Blockly
。建议能直接采用官方写法处不要随意修改。如在使用 webpack
时,只引入 blockly/core
会导致无法加载原生积木,这就是没有采用官方示例写法导致的。
本教程的示例项目基于 blockly-webpack 修改而成。使用 Blockly 2021Q2
版本。
引入 Blockly
依赖之后,就可进行 Blockly
二次开发。一般而言二次开发涉及如下内容:
在网页内显示
Blockly
编辑器编写自己的积木外观
编写自己的积木代码生成器
生成自己的
ToolBox
编写序列化相关模块
编写或使用已有的
Theme
编写或使用其他
Blockly
插件(如Connection Checker
)通过
MonkeyPatch
进行其他修改(慎用)
本教程不会涉及任何 MonkeyPatch
相关内容。使用 MonkeyPatch
前请先仔细研读源码。后果自负。
最后更新于