node.js - Försöker använda mocha, ES6-moduler och ts-node med --experimental-loader-alternativet

Jag försöker få ts-node-alternativet --experimental-loader att fungera tillsammans med mocha, men har ingen tur. Fram till dess att jag började försöka kompilera ES6-moduler, brukade jag kunna köra mocha-tester på detta sätt:

"test": "nyc --reporter=html mocha --require ts-node/register src/**/*.spec.ts"

Det fungerar inte längre när man genererar ES6-moduler.

Jag skulle använda TS_NODE_COMPILER_OPTIONS='{\"module\": \"commonjs\" }'-lösningen för testning, men det fungerar inte för mig på grund av en annan komplikation: Jag genererar ES6-moduler som ett första steg i min build, men genererar också ES5/CommonJS-moduler med webpack och babel. Det sista steget fungerar inte om jag inte lägger till .js i slutet av mina lokala TypeScript-import-satser.

Men att lägga till dessa .js-ändelser visar sig bryta TS_NODE_COMPILER_OPTIONS='{\"module\": \"commonjs\" }'-lösningen, vilket dock fungerar om jag går tillbaka och tar bort alla .js-ändelser. Jag vill uppenbarligen inte ha en test- och byggprocess där jag ständigt måste växla mellan att lägga till och ta bort dessa ändelser.

För att förenkla för nu har jag tagit bort nyc, och jag försöker köra tester så här:

mocha -r ts-node/register --experimental-loader ./ts-loader.mjs src/**/*.spec.ts

Jag får inga fel på detta sätt, men inget händer heller. Det är som om src/**/*.spec.ts inte existerar.

Min gör-ingenting (för nu) dummy-laddare ser ut så här:

console.log('ts-loader loaded');

export async function resolve(specifier, context, defaultResolve) {
  console.log('resolve');
  return defaultResolve(specifier, context, defaultResolve);
}

export async function getFormat(url, context, defaultGetFormat) {
  console.log('getFormat');
  return defaultGetFormat(url, context, defaultGetFormat);
}

export async function getSource(url, context, defaultGetSource) {
  console.log('getSource');
  return defaultGetSource(url, context, defaultGetSource);
}

export async function transformSource(source, context, defaultTransformSource) {
  console.log('transformSource');
  return defaultTransformSource(source, context, defaultTransformSource);
}

export function getGlobalPreloadCode() {
  console.log('getGlobalPreloadCode');
  return '';
}

Jag kan se att det laddas eftersom meddelandet 'ts-loader loaded' visas, men ingen av funktionerna kallas någonsin.

Jag har försökt med andra permutationer, men får bara fel som src/**/*.spec.ts behandlas som ett bokstavligt filnamn istället för ett glob-mönster, eller fel om att moduler inte hittas.

Jag hoppades på att se min loader anropas för varje import som hanteras, och sedan lista ut hur man manipulerar filändelserna, men jag har inte lyckats komma så långt än. Några förslag?

Jag använder node v14.15.1. Den fullständiga koden för mitt projekt, med en fungerande build men trasiga tester, kan hittas här: https://github.com/kshetline/tubular_math

Svar #1

Jag hittade äntligen en lösning, även om det inte var i linje med vad jag ursprungligen letade efter. Jag gav upp försöken att göra Mocha nöjd med de extra .js-tilläggen, och hittade ett sätt att göra Webpack nöjd utan dem. Så...

import { Angle, Mode, Unit } from './angle.js';

...gick tillbaka till...

import { Angle, Mode, Unit } from './angle';

Mitt testschema ser ut så här:

  "scripts": {
    "build": "rimraf dist/ && tsc && webpack && webpack --env target=umd",
    "prepublishOnly": "npm run build",
    "lint": "eslint 'src/**/*.ts'",
    "test": "TS_NODE_COMPILER_OPTIONS='{\"module\":\"commonjs\"}' nyc --reporter=html mocha --require ts-node/register src/**/*.spec.ts"
  },

Och slutligen, viktigast av allt, listade jag ut hur man gör webpack 5.x (4.x hade inte detta problem) nöjd med lokala JavaScript-importer som inte har ett .js-tillägg, vilket webpack annars nu insisterar på om din package.json säger "type": "module":

    module: {
      rules: [
        { test: /\.js$/, use: 'babel-loader', resolve: { fullySpecified: false } }
      ]
    }

...där inställningen fullySpecified till false är nyckeln till lösningen.

UPPDATERING: Exemplet ovan gjordes på ett medvetet enkelt projekt, något lätt för en nybörjare att generera ett npm-paket med ESM-moduler. Nu när jag försöker något lite mer avancerat, har jag stött på ett problem igen när jag kör enhetstester. Så fort en *.spec.ts-fil direkt eller indirekt importerar extern kod, misslyckas moduluppladdningen. Jag kan bara testa kod utan externa beroenden tills jag räknat ut hur jag ska lösa det problemet. Tydligen låter användningen av "TS_NODE_COMPILER_OPTIONS='{\"module\":\"commonjs\"}' mig bara gå ett steg längre i att lösa det grundläggande problemet med att köra mocha tillsammans med ts-node.