Help! How to integrate in existing electron app?

[dewiweb]

Hello,
after integration in my electron app with yarn add deutschesoft/awml
I don't understand well how to integrate AWML in my frontend.
I've test: <script type=module src="../node_modules/@deutschesoft/awml/src/index.js"></script> in the head of my index.html
with:

            <h1>These two knobs stay in sync</h1>
          
            <awml-knob min='0' max='10'>
              <awml-option type=bind name='value' src='local:foo'></awml-option>
            </awml-knob>
            <awml-knob min='0' max='10'>
              <awml-option type=bind name='value' src='local:foo'></awml-option>
            </awml-knob>
          </awml-root>

in the body but nothing appear ....

regards

[arneg]

Hi!

You probably want to integrate both https://github.com/DeutscheSoft/aux-widgets for the widgets and AWML to do bindings. How is your electron project structured? Do you use a tool to package the web ui?

Arne

[dewiweb]

I think there's something wrong with ES6 modules in electron, maybe a lack of support...

[arneg]

I think the problem might be that electron example projects often simply load the main HTML file from disk (using file:// URL). However, es6 modules cannot be loaded from file URLs. Some options which work

• use a packaging tool to bundle all javascript into a es5 bundle (you can use rollup for that for example)
• start a simple http server (listening on localhost) inside the electron app and load the corresponding URL

I think option 1 would be better here, also because you pull aux-widgets and awml using npm and they might be loaded from node_modules which is not necessarily part of the http server htdocs.