Assistance request

[MaximilianoR]

Good morning
go tried to search for a chat ho other form that requesting assistance but I have not found anything and I hope you can help me.

I am trying to implement the "mirador-textoverlay" module on my Digital Theca but I am encountering some problems which I will describe.

1. As described in the "https://github.com/dbmdz/mirador-textoverlay" page I tried to download everything I need using the "npm install mirador-textoverlay" command (to make sure there were no compatibility problems with other programs I created a completely empty Debian 11 VM), but it gives me compatibility errors which I report in Appendix A at the bottom of this post of mine that I tried to fix with negative results
2. I forced the compilation of the material described in the previous point and tried to make a test HTML page with your documentation, when I tried to launch the javascript with the command "import Mirador from 'mirador/dist/es/src/index';" first it wants the script to be of type="module" and it reports me that the index file does not exist and actually only an index file exists in the indicated folder. js file, even if I create a symlink for that file the problem occurs for other internal calls in the code, so I don't understand where I'm going wrong, in appendix B I give you the script as I'm trying to implement it

If it helps I am trying to run this on a debian 11 server with apache2

Any help you can give me is welcome and I thank you for your patience

Best regards
Massimiliano Randazzo

Appendix A

root@mirador:/usr/local/bin/mirador# npm install mirador-textoverlay
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: undefined@undefined
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR! peer react@"^16.8.0 || ^17.0.0" from @material-ui/[email protected]
npm ERR! node_modules/@material-ui/core
npm ERR! peer @material-ui/core@"^4.11.0" from [email protected]
npm ERR! node_modules/mirador-textoverlay
npm ERR! mirador-textoverlay@"^0.3.8" from the root project
npm ERR! peer @material-ui/core@"^4.0.0" from @material-ui/[email protected]
npm ERR! node_modules/@material-ui/icons
npm ERR! peer @material-ui/icons@"^4.9.1" from [email protected]
npm ERR! node_modules/mirador-textoverlay
npm ERR! mirador-textoverlay@"^0.3.8" from the root project
npm ERR! 1 more (mirador)
npm ERR! 2 more (@material-ui/lab, mirador)
npm ERR! peer react@"17.0.2" from [email protected]
npm ERR! node_modules/react-dom
npm ERR! peer react-dom@"^16.8.0 || ^17.0.0" from @material-ui/[email protected]
npm ERR! node_modules/@material-ui/core
npm ERR! peer @material-ui/core@"^4.11.0" from [email protected]
npm ERR! node_modules/mirador-textoverlay
npm ERR! mirador-textoverlay@"^0.3.8" from the root project
npm ERR! 3 more (@material-ui/icons, @material-ui/lab, mirador)
npm ERR! peer react-dom@"^16.8.0 || ^17.0.0" from @material-ui/[email protected]
npm ERR! node_modules/@material-ui/icons
npm ERR! peer @material-ui/icons@"^4.9.1" from [email protected]
npm ERR! node_modules/mirador-textoverlay
npm ERR! mirador-textoverlay@"^0.3.8" from the root project
npm ERR! 1 more (mirador)
npm ERR! 1 more (@material-ui/lab)
npm ERR! 2 more (@material-ui/icons, @material-ui/lab)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.8.3" from [email protected]
npm ERR! node_modules/mirador
npm ERR! peer mirador@"^3.0.0" from [email protected]
npm ERR! node_modules/mirador-textoverlay
npm ERR! mirador-textoverlay@"^0.3.8" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /root/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2023-05-15T06_47_35_049Z-debug.log

Appendix B

<script type="module"> var exports = {};

import Mirador from './mirador/dist/es/src/index';
import textOverlayPlugin from './mirador-textoverlay/es';

  const miradorConfig = {
   id: 'mirador',
   language: 'it',
   config: [{language:'it',}],
   theme: {
     transitions: window.location.port === '4488' ?  { create: () => 'none' } : {},
   },
   window: {
     textOverlay: {
       enabled: true,
       selectable: true,
       visible: false,
     },
   },
   windows: [{
     manifestId: 'http://mw-mirador.bncf.lan/IIIF/IlPiccolo/00c1e255-c838-42f2-bbea-5e30b15417bc/manifest',
   }],
   catalog: [
     { manifestId: 'http://mw-mirador.bncf.lan/IIIF/IlPiccolo/00c1e255-c838-42f2-bbea-5e30b15417bc/manifest', provider: "Teca Digitale MadeWord" },
   ]
 }

  Mirador.viewer(miradorConfig);
</script>

[jbaiter]

See my answer here: ProjectMirador/mirador#3769 (comment)

You have to use the stable version of Mirador.