The TypeScript file generated by Fable tries to import a file with a .js extension that does not exist

[eagle-k]

Description

The TypeScript file generated by Fable imports a .js file, for example

import { int32 } from "../fable_modules/fable-library-ts/Int32.js";

However, this is problematic in a non-Vite environment because Fable only generates .ts files.
For reference, I got the following build error when I tried to use the Fable generated TypeScript file with Next.js.)

Module not found: Can't resolve '../fable_modules/fable-library-ts/Int32.js'

When Fable generates a TypeScript file, how about omitting the extension of the file to be imported as follows?

import { int32 } from "../fable_modules/fable-library-ts/Int32";

Alternatively, I would like to know if there is a recommended way to use TypeScript files in a non-Vite environment (Next.js in this case).

Related information

• Fable version: dotnet fable --version 4.9.0
• Operating system: Windows

[MangelMaxime]

I believe in general when importing files in JavaScript, it is recommended to set the extension.

This is because, resolution of the import is dependant on the runtime and if you are in the browser for example. Then it can't guess the extension of the file because it doesn't have access to the file system.

When generating to TypeScript, Fable should use the .ts file path in the import statement as this is the actual name of the file on the disk.

[eagle-k]

After additional research, it appears that this is (or should be) considered a bug in Next.js.
vercel/next.js#59744

I am not sure it is reasonable for the Fable compiler to address this issue.

[MangelMaxime]

I think when generating TypeScript Fable should import files using .ts because this is what you would write manually.

Unless, this is interop import like import "XX" "file.ext" then in such cases we need to respect what the user provided.

[ncave]

@MangelMaxime

I think when generating TypeScript Fable should import files using .ts

Here is the reason why TypeScript compiler doesn't want to support .ts extensions for imports.

OTOH, some runtimes only support imports with .ts extensions, e.g. Deno.

Perhaps we can introduce another compiler flag just for the TypeScript import extension.
It may provide more flexibility over the generated TS imports, but we should probably keep the defaults as they are today.

(Technically, using .ts extensions can be enabled in TypeScript, but only when you don't actually need it to emit any code, just use it for type-checking in a pipeline or UI).

[MangelMaxime]

I didn't know about that.

Seems like the current Fable behaviour is the recommended way from TypeScript team. And so indeed if we want to address this issue we should add a new flag.

The question is it worth adding it?

[MangelMaxime]

I am closing this issue for now. It seems like we are doing the correct generation and adding a new flag could be confusing.

We can re-visit in the future if needed.