Wiederverwendung von JS-Code zwischen Browser und Server mit Abhängigkeit von pngjs ⇐ JavaScript

[Anonymous]

Wie kann ich MyNewClass auf MyExistingModule verschieben, sodass das Modul sowohl in Browser- als auch in Server-(Knoten-)Umgebungen funktioniert? Ich habe damit begonnen, die neue Klasse direkt im HTML zu schreiben.

Code: Select all

import { MyExistingClass1 } from './MyExistingModule.js'

const PNG = png.PNG;

class MyNewClass {
#myPng;
constructor() {
this.#myPng = new PNG();
// Do things that a MyNewClass does.
}
}

Ich habe ein anderes Modul, das nur auf dem Server verwendet wird, der derzeit PNGJs ​​verwendet, und soweit ich das beurteilen kann, ist PNG oben nicht von PNG unten zu unterscheiden.

Code: Select all

import { PNG } from 'pngjs/browser'

class SomeThirdClass {
// Actual code replaced with a trivial example for illustration purposes.
makeNewPng(w, h) {
const newPng = new PNG();
newPng.width = w;
newPng.height = h;
// Do things that a SomeThirdClass does.
}
}

Code: Select all

// How do I "import" pngjs here so that it works in both environments? Or at least doesn't interfere with the web CDN version?

class MyExistingClass {
static ignoreScaleMisalignmentErrors = false;
static suggestedMaximumTileSheetColorCount = 8;
static get CURRENT_VERSION() { return ("1.0.0") };
}

Die verwandten Fragen, die ich sehe, sind entweder sehr alt oder beschreiben ein anderes Problem, und ich würde gerne wissen, was, wenn überhaupt, aktuelle kanonische Lösungen für dieses Problem sind.