Webpack и Ts-loader не могут сгенерировать правильный код ESM JavaScript для импорта модуля и запуска его в Node. ⇐ Javascript

[Anonymous]

Я пытаюсь преобразовать файл TypeScript (test.ts) в файл ESM JavaScript (bundle.js) с помощью веб-пакета, ts-loader и узла (из NodeJS). Для этой цели я создал файлы webpack.config.js и tsconfig.json и запустил команду npm run build в своем рабочем каталоге. К сожалению, при выполнении сгенерированного файла JavaScript ESM в узле я получил следующее сообщение об ошибке:
root@a213537a64f9:/var/www/html# npm run build

> build
> webpack --mode production

asset bundle.js 110 bytes [compared for emit] [javascript module] [minimized] (name: main)
orphan modules 84 bytes [orphan] 2 modules
./src/test.ts + 2 modules 278 bytes [not cacheable] [built]

Код: Выделить всё

webpack 5.104.1 compiled successfully in 30010 ms

root@a213537a64f9:/var/www/html# node ./dist/bundle.js
file:///var/www/html/dist/bundle.js:1
import{Enums as o}from"@cornerstonejs/core";import"@cornerstonejs/dicom-image-loader";const{ViewportType:r}=o;
^^^^^
SyntaxError: Named export 'Enums' not found. The requested module '@cornerstonejs/core' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from '@cornerstonejs/core';
const {Enums: o}from"@cornerstonejs/core";import"@cornerstonejs/dicom-image-loader";const{ViewportType:r} = pkg;

at ModuleJob._instantiate (node:internal/modules/esm/module_job:146:21)
at async ModuleJob.run (node:internal/modules/esm/module_job:229:5)
at async ModuleLoader.import (node:internal/modules/esm/loader:473:24)
at async asyncRunEntryPointWithESMLoader (node:internal/modules/run_main:122:5)

Node.js v20.18.1

Похоже, что webpack и ts-loader не могут сгенерировать правильный код JavaScript ESM для импорта модуля Enums из модуля @cornerstonejs/core. Node интерпретирует модуль @cornerstonejs как модуль CommonJS (однако, насколько мне известно, @cornerstonejs написан на коде ESM JavaScript и TypeScript).  Как я могу настроить свои
webpack.config.js и tsconfig.json для решения этой проблемы?
Это мой файл package.json:
{
"devDependencies": {
"@types/node": "^25.0.3",
"ts-loader": "^9.5.4",
"typescript": "^5.9.3",
"webpack-node-externals": "^3.0.0"
},
"dependencies": {
"@cornerstonejs/calculate-suv": "^1.1.0",
"@cornerstonejs/core": "^4.15.1",
"@cornerstonejs/dicom-image-loader": "^4.15.1",
"@cornerstonejs/nifti-volume-loader": "^4.15.1",
"@cornerstonejs/tools": "^4.15.1",
"@icr/polyseg-wasm": "^0.4.0",
"dcmjs": "^0.47.1",
"dicomweb-client": "^0.11.2",
"husky": "^9.1.7",
"webpack": "^5.104.1",
"webpack-cli": "^6.0.1"
},
"scripts": {
"build": "webpack --mode production"
},

"type": "module"
}


Это мой файл webpack.config.js:
import path from 'path'
//const __dirname = import.meta.dirname;

import nodeExternals from 'webpack-node-externals'

export default{
entry: "./src/test.ts",
externalsPresets: { node: true },
externals: [nodeExternals({ importType: 'module' })],
experiments: {outputModule: true,},
output: {
filename: "bundle.js",
path: "/var/www/html/dist" //path.resolve(__dirname, "dist")
},
module: {
rules: [
{
test: /\.(mjs|js|ts)$/,
use: 'ts-loader',
exclude: /node_modules/
}
]
},
resolve: {
extensions: [".ts", ".tsx", ".js", ".json"]

}


Это файл TypeScript (test.ts, расположенный в папке src), который я хочу преобразовать:
import type { Types } from '@cornerstonejs/core';
import { RenderingEngine, Enums, init as coreInit } from '@cornerstonejs/core';
import { init as dicomImageLoaderInit } from '@cornerstonejs/dicom-image-loader';

const { ViewportType } = Enums;

А это код, сгенерированный webpack и ts-loader (bundle.js находится в папке dir):
import{Enums as o}from"@cornerstonejs/core";import"@cornerstonejs/dicom-image-loader";const{ViewportType:r}=o;
 

Подробнее здесь: [url]https://stackoverflow.com/questions/79856335/webpack-and-ts-loader-cannot-generate-a-proper-esm-javascript-code-to-import-a-m[/url]