Blockly with webpack

[Pedro Borges]

I'm building an application with phaser and blockly, I already have a functional prototype in plain js but now I'm transfering to node and webpack and don't really know how to do this with blockly, phaser is easy because they already have a node compatible version.

The real problem is to make the bundled code interact with the index.html and get rid of these when building with webpack:

ERROR in ./node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js

Module not found: Error: Can't resolve 'child_process' in 'E:\Projects\Working\phaser-prototype\node_modules\jsdom\lib\jsdom\living'

 @ ./node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js 4:22-46

 @ ./node_modules/jsdom/lib/jsdom/browser/Window.js

 @ ./node_modules/jsdom/lib/api.js

 @ ./node_modules/blockly/blockly_node_javascript_en.js

 @ ./src/main.js

ERROR in ./node_modules/jsdom/lib/jsdom/browser/resources/resource-loader.js

Module not found: Error: Can't resolve 'fs' in 'E:\Projects\Working\phaser-prototype\node_modules\jsdom\lib\jsdom\browser\resources'

 @ ./node_modules/jsdom/lib/jsdom/browser/resources/resource-loader.js 2:11-24

 @ ./node_modules/jsdom/lib/api.js

 @ ./node_modules/blockly/blockly_node_javascript_en.js

 @ ./src/main.js

etc....

[Coda Highland]

Blockly is (mostly) NodeJS compatible. The issue is in your webpack config.

The webpack config needs to have target: 'node' in it so it knows it's supposed to compile it to have access to the NodeJS built-in modules.

/s/ Adam

--
You received this message because you are subscribed to the Google Groups "Blockly" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Pedro Borges]

I did this to the webpack config

    target: 'node',

    externals: {

        bufferutil: 'ws',

        'utf-8-validate': 'ws',

        canvas: 'jsdom'

    }

and now there are no erros, but I still don't know how to do a Blockly Inject, getElementById always returns null when bundling in webpack

On Tuesday, April 9, 2019 at 8:58:46 AM UTC-3, Coda Highland wrote:

Blockly is (mostly) NodeJS compatible. The issue is in your webpack config.

The webpack config needs to have target: 'node' in it so it knows it's supposed to compile it to have access to the NodeJS built-in modules.

/s/ Adam

On Mon, Apr 8, 2019 at 11:39 PM Pedro Borges <pedro.h...@gmail.com> wrote:

I'm building an application with phaser and blockly, I already have a functional prototype in plain js but now I'm transfering to node and webpack and don't really know how to do this with blockly, phaser is easy because they already have a node compatible version.

The real problem is to make the bundled code interact with the index.html and get rid of these when building with webpack:

ERROR in ./node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js

Module not found: Error: Can't resolve 'child_process' in 'E:\Projects\Working\phaser-prototype\node_modules\jsdom\lib\jsdom\living'

 @ ./node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js 4:22-46

 @ ./node_modules/jsdom/lib/jsdom/browser/Window.js

 @ ./node_modules/jsdom/lib/api.js

 @ ./node_modules/blockly/blockly_node_javascript_en.js

 @ ./src/main.js

ERROR in ./node_modules/jsdom/lib/jsdom/browser/resources/resource-loader.js

Module not found: Error: Can't resolve 'fs' in 'E:\Projects\Working\phaser-prototype\node_modules\jsdom\lib\jsdom\browser\resources'

 @ ./node_modules/jsdom/lib/jsdom/browser/resources/resource-loader.js 2:11-24

 @ ./node_modules/jsdom/lib/api.js

 @ ./node_modules/blockly/blockly_node_javascript_en.js

 @ ./src/main.js

etc....

--
You received this message because you are subscribed to the Google Groups "Blockly" group.

To unsubscribe from this group and stop receiving emails from it, send an email to blo...@googlegroups.com.

[Pedro Borges]

Nevermind, I got it, thanks for the help

[Coda Highland]

I don't think you need to inject when you're working server-side. You'll be working with the XML and the code generator.

/s/ Adam

To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.

[Bimaswara Adam]

i got a same problem with you. have you found an idea to solve it?

[Eugene Formanenko]

You can use https://www.npmjs.com/package/node-blockly