Add support for tsimp TS loader

[wojtekmaj]

Is your feature request related to a problem? Please describe.

I would like to replace ts-node with tsimp, but when I try to replace

    "build": "NODE_ENV=production NODE_OPTIONS='--loader ts-node/esm' webpack",

with

    "build": "NODE_ENV=production NODE_OPTIONS='--import tsimp/import' webpack",

I'm met with the following error:

[webpack-cli] Unable load '/app/webpack.config.ts'
[webpack-cli] Unable to use specified module loaders for ".ts".
[webpack-cli] Cannot find module 'ts-node/register' from '/app'
[webpack-cli] Cannot find module 'sucrase/register/ts' from '/app'
[webpack-cli] Cannot find module '@babel/register' from '/app'
[webpack-cli] Cannot find module 'esbuild-register/dist/node' from '/app'
[webpack-cli] Cannot find module '@swc/register' from '/app'
[webpack-cli] Please install one of them

Describe the solution you'd like

Add tsimp to the list of allowed TS module loaders

Describe alternatives you've considered

🤷‍♂️

[alexander-akait]

NODE_ENV=production NODE_OPTIONS='--loader=tsimp/loader' webpack works fine for me locally without any problem, expect experimental message, check your enviroment, looks like you don't have installed tsimp

Here docs - https://github.com/tapjs/tsimp?tab=readme-ov-file#usage, supported ESM --import is still under experiments

Close due #3905

Feel free to feedback

[wojtekmaj]

@alexander-akait Unfortunately, this does not work. --loader or --import, doesn't make a diffetence. I double checked, I do have tsimp installed correctly. Still getting:

[webpack-cli] Unable load '/app/webpack.config.ts'
[webpack-cli] Unable to use specified module loaders for ".ts".
[webpack-cli] Cannot find module 'ts-node/register' from '/app'
[webpack-cli] Cannot find module 'sucrase/register/ts' from '/app'
[webpack-cli] Cannot find module '@babel/register' from '/app'
[webpack-cli] Cannot find module 'esbuild-register/dist/node' from '/app'
[webpack-cli] Cannot find module '@swc/register' from '/app'
[webpack-cli] Please install one of them

I have also tried adding --disable-interpret, hoping that maybe it could resolve the issue for me, but to no avail.

[alexander-akait]

@wojtekmaj strange, maybe you can create a reproducible repo? Because it works locally for me, also please check your version

[wojtekmaj]

There is absolutely nothing unusual about my setup. Here's my minimal repro repo:

web.zip

However, I believe the key is that you may have one of the listed packages ('ts-node/register', 'sucrase/register/ts', '@babel/register', 'esbuild-register/dist/node', '@swc/register') installed alongside tsimp, causing the error not to appear.

[alexander-akait]

I see the problem, right now you can use:

"scripts": {
    "build": "WEBPACK_CLI_FORCE_LOAD_ESM_CONFIG=1 NODE_ENV=production NODE_OPTIONS='--import tsimp/import' webpack --disable-interpret"
},

Anyway you still have some problems with ts/babel configuration.

Using --disable-interpret you will disable built-in behaviour and using WEBPACK_CLI_FORCE_LOAD_ESM_CONFIG you are saying to load configuration as ESM.

Feel free to feedback

[alexander-akait]

Anyway in future we will improve it and you will need less extra code to run it, we are waiting interpret developers, also we need support --import syntax on the interpret side (right now only register wroks)

[wojtekmaj]

This worked for me! Thanks!