在Angular应用程序中找不到Blockly Generator函数

如何解决在Angular应用程序中找不到Blockly Generator函数

我正在尝试使用Angular构建一个Blockly应用程序。我使用npm安装了Blockly。我还在angular.json

中添加了以下脚本

"scripts": [
              "node_modules/blockly/blockly_compressed.js","node_modules/blockly/blocks_compressed.js","node_modules/blockly/python_compressed.js","node_modules/blockly/msg/en.js"
            ]

尽管我可以使用import * as Blockly from 'blockly'在应用程序中进行块导入并使用其他功能，但找不到Blockly.Python['text_indexOf']之类的Generator函数

我正在批量使用：^ 3.20200625.2 和 @ angular / cli：〜9.1.0 版本。

我错过了什么吗？谁能帮我解决这个问题？

解决方法

我在电子+角度应用程序构建方面遇到了同样的问题，下一个解决方案对我有所帮助。

Blockly的参考文献says指出，Python的生成器类应随python_compressed.js一起包含在文件blockly_compressed.js中。所以我需要包括这些文件。

首先，我使用copy-webpack-plugin将所需文件从Blockly的安装目录node_modules/blockly复制到assets/js：

var CopyPlugin = require('copy-webpack-plugin');

module.exports = {
    ...
    plugins: [
        ...
            new CopyPlugin([
                {
                    from: 'node_modules/blockly/blockly_compressed.js',to: 'assets/js/[name].[ext]'
                },{
                    from: 'node_modules/blockly/blocks_compressed.js',{
                    from: 'node_modules/blockly/python_compressed.js',{
                    from: 'node_modules/blockly/msg/en.js',to: 'assets/js/msg/[name].[ext]'
                },]),...
    ]
    ...
}

我添加了直接从js/assets的底部从index.html调用的脚本后：

<!DOCTYPE html>
<html>
    <head>...</head>
    <body><app-root>...</app-root></body>
    <script src="assets/js/blockly_compressed.js"></script>
    <script src="assets/js/blocks_compressed.js"></script>
    <script src="assets/js/python_compressed.js"></script>
    <script src="assets/js/msg/en.js"></script>
</html>

在构建Webpack之后，请在控制台中检查python的生成器：

> typeof Blockly.Python
< "object"

在Angular应用程序中找不到Blockly Generator函数

如何解决在Angular应用程序中找不到Blockly Generator函数

解决方法

相关推荐