Unable to get it to work (worker.js problem)

[RaulLazaro]

Hello,

I am trying to test this package as it looks very interesting but I am unable to get it to work.

First I tried a project with Angular, create a simple component very similar to your example.

import { Component, OnInit } from '@angular/core';
import {CuraWASM} from 'cura-wasm/dist/es';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
  //Create a slicer
  slicer = new CuraWASM({
    definition: 'ultimaker2',
    verbose: true
  });
  stl: any;
  percent: number = 0;
  elapsed: Date = new Date(0);
  gcode: ArrayBuffer;

  ngOnInit() {
    //Add progress handler
    this.slicer.on('progress', percent => {
      this.percent = percent;
    });
  }

  handleFileInput(files: FileList) {
    if (files && files.length > 0) {
      this.stl = files.item(0);
    } else {
      this.stl = null;
    }
  }

  async slice() {
    const start = Date.now();
    this.gcode = await this.slicer.slice(this.stl)
    const end = Date.now();

    //Calculate elapsed time
    this.elapsed = new Date(end - start);
  }
}

But when clicking on slice I get this error.

In a second attempt, I copied your code from the demo folder and use webpack to bundle the js, but the same error occurred.

I don't know if any extra configuration is necessary, perhaps from webpack, or there is something wrong with the package.

[Wakeful-Cloud]

@RaulLazaro May I ask what version you're using? I apologize for the example not working.

[RaulLazaro]

I started with version v1.1.1-beta.0 but today I am testing with the last one, v1.1.1

[Wakeful-Cloud]

@RaulLazaro I believe the problem is with serving worker.js. Can you verify if your dev server is serving it at http://localhost:4201/worker.js (It should be a minified JS file)?

[RaulLazaro]

it is not being served. But I don't know how to configure it because the worker.js file is the one inside node_modules/cura_wasm/dist/es ?

[Wakeful-Cloud]

@RaulLazaro Yes, it's located at node_modules\cura-wasm\dist\es\worker.js. I'm afraid this might be a bug with /index.js being hard-coded into cura-wasm preventing all but the demo from working.

[Wakeful-Cloud]

@RaulLazaro Could you post your webpack + dev-server configuration?

[RaulLazaro]

I'm using the default ones, I don't have much experience with webpack.

I simply run npx webpack to bundle src/index.js to dist/main.js

And then serve with npm script:

"scripts": {
  "start": "webpack-dev-server"
}

[Wakeful-Cloud]

@RaulLazaro Can you check if the worker.js is served under the dist directory? (http://localhost:4201/dist/worker.js)

[Edit] After looking at your original post again, I just want to make sure you're aware that the demo uses nollup (Rollup + dev server) to serve it, not wepback (Cura WASM should work with wepback but the demo was not designed to use it).

[Edit 2] Wepback should take care of package resolution but I'm not sure if threads.js (Used to offload slicing to a separate thread) plays nicely with the default dependency resolution. One potential hack is to require the worker in the Angular component? so it gets bundled with everything else.

[Edit 3] I have a working reproduction and can confirm that there's a problem with bundling and threads.

[Edit 4] This bug effects ALL installations using Webpack. A fix has been started.

[Edit 5] The fix can be tracked in the webpack-fix branch

[Edit 6] Currently working on developing a new Rollup plugin because rollup-plugin-bundle-imports isn't working on NodeJS (But it is working in the browser)

[Edit 7] The in-development plugin appears to be working! I've verified it works with both Angular (Webpack), Rollup, and NodeJS. Hoping for a release in the next 24 hours.

[Wakeful-Cloud]

@RaulLazaro cura-wasm@1.2.1 is working for me with Angular.

I did notice a bug in your implementation: this.stl was a reference to a File, not an ArrayBuffer. The fix is to call this.stl.arrayBuffer() which returns a promise that resolves to an ArrayBuffer.

Please tell me if anything else does not work and thanks for filing this issue.

[RaulLazaro]

It works great!! Thanks for your time.