Cannot render: worker-bundle.js:1 Uncaught SyntaxError: Unexpected token '<'

[freyja-934]

I tried a bunch of different ways to do this and still get this same error.

import React from "react";
// Component
import Villain from "villain-react";
// Css styles
import "villain-react/dist/style.css";
export default function ComicReader() {
  let workerUrl = 'webworkers/worker-bundle.js';
  const url = "/assets/comics/test-comic-zip.zip";
  const opts = {
    theme: 'Dark',
    allowFullScreen: true,
    autoHideControls: false,
    allowGlobalShortcuts: true,
  };
  return (
    <div
      style={{
        width: "100%",
        margin: "0 auto",
        display: "block",
        paddingTop: "100px",
        backgroundColor: "#000000",
      }}
    >
      <Villain
        source={url}
        options={opts}
        workerUrl={workerUrl}
        className={'comic-viewer'}
      />
    </div>
  );
}

[freyja-934]

@btzr-io do you have a working example of this in a react app?

[btzr-io]

@btzr-io do you have a working example of this in a react app?

I'm not longer working on this project. I guess some dependencies are outdated or not longer work with this react component.

A full web-app example can be found here: ( Idk if this still works ) https://github.com/btzr-io/Villain/tree/master/packages/villain-web

Try the embed api. ( I'm not sure if this still works ), it should be easy to use an iframe instead: https://villain.js.org/#/embed

[btzr-io]

This issue was resolved on the new version. I'll try to publish the new version in a few days / weeks. I'm reopening this since this still exists in the current version.