Targetting ES2015 modules for current browsers not possible (ts:import "name" -> js:import "./name.js")

[urbanhop]

I want to emit javascript with ES2015 modules. My tsconfig is

"target": "es2017",
"module": "es2015",
...

Problem: Typescript expects

import { Component, h, render } from "preact";

In my js files I need however

import { Component, h, render } from "./preact.js";

Maybe might origin from partial browser implementations. At least I could not find any way to work with import "preact" in typesript and emitting import "./preact.js" in js.

Is there a way to get the "./name.js" for into emitted import statements?
If not, are there plans to appraoch the problem?

Duplicate of #4595 -- should already have been fixed by #8895

[urbanhop]

Yes, I work with tsc 2.6.2 and the common case works.

I am actually left with a problem when using the preact library. For preact I hacked a preact.js with exports, such that the browser has an es2015 module. In addition, I use the preact.d.ts file provided by the preact author. For the latter, "./preact.js" does not work.

Could you hint me on how I can deal with that? (now using string-replace on emitted js files, which I would like to get rid of asap)

You could use path mapping.
EDIT: Actually, that' won't work on a relative path -- but you could create a preact.d.ts that symlinks to the one in node_modules.
EDIT: Actually that won't work either, because node_modules/preact/dist/preact.d.ts uses an ambient module declaration declare module "preact". So you'll have to create a local preact.d.ts containing:

import preact = require("preact");
export = preact;

[urbanhop]

Success! Have to figure out the mechanisms going on behind the scenes.

Added suggested preact.d.ts with

import preact = require("preact");
export = preact;

With that in place, import "./preact.js" fails with

error TS2497: Module '".../src/preact"' resolves to a non-module entity and cannot be imported using this construct.

Added a preact.ts with the contents of preact.d.ts .

error TS2306: File '/src/preact.ts' is not a module.

By trials and accident found that the existence of the very same file with any arbitrary name, like p_r_e_act.ts, makes it working! Looks like files are scanned and exhibit effects based on their contents alone. A somewhat mystic but comfortable solution.

Thank you so much for your thoughts and time, very helpful and highly appreciated!

By trials and accident found that the existence of the very same file with any arbitrary name, like p_r_e_act.ts, makes it working! Looks like files are scanned and exhibit effects based on their contents alone. A somewhat mystic but comfortable solution.

That can't be right, are you sure? Can you get a repro?

The resolves to a non-module entity means you should use import preact = require("preact") instead of import * as preact from "preact";.

[urbanhop]

You are right, turns out that my above statements are not correct. Looks like some caching effects disturbed observations. I continue my trials. Thx for the additional input.