Unable to find Blockly Generator function in Angular application

Question

Unable to find Blockly Generator function in Angular application

248 views Asked by Arbaz Sheikh At 15 September 2024 at 11:55

I am trying to build a Blockly Application using Angular. I installed Blockly using npm . I also added the following scripts in 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"
            ]

Though i can use import * as Blockly from 'blockly' to import blockly in the application and use other functions, I am not able to find Generator functions like Blockly.Python['text_indexOf']

I am using blockly: ^3.20200625.2 and @angular/cli: ~9.1.0 versions.

Am i missing something. Can anyone help me with this issue?

Original Q&A

There are 1 answers

**Vadim Grishin** · Answer 1 · 2020-09-30 07:56:04

I've had the same problem with electron+angular app building, the next solution had helped me.

Blockly's reference says that Python's generator class should be included with file python_compressed.js right after blockly_compressed.js. So I need to include these files.

First I've used copy-webpack-plugin to copy needed files from Blockly's install directory node_modules/blockly to 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',
                    to: 'assets/js/[name].[ext]'
                },
                {
                    from: 'node_modules/blockly/python_compressed.js',
                    to: 'assets/js/[name].[ext]'
                },
                {
                    from: 'node_modules/blockly/msg/en.js',
                    to: 'assets/js/msg/[name].[ext]'
                },
            ]),
        ...
    ]
    ...
}

After I've added scripts calling from js/assets directly from index.html's bottom:

<!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>

After webpack build check python's generator in console:

> typeof Blockly.Python
< "object"

TechQA.

Unable to find Blockly Generator function in Angular application

There are 1 answers

Related Questions in BLOCKLY

Related Questions in GOOGLE-BLOCKLY

Popular Questions

Popular Tags

Trending Questions