New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Question] Missing file extension in import statements in transpiled files #1505
Comments
Yes. It’s already in the issue you linked to: #622 (comment). Note that neither TS nor node adds implicit |
Then I guess I'm going to stick to (probably preferable) I checked the comment again and maybe I ignored this at the first time
The plugin solution on the other hand is a bit weird in my opinion, since using Thanks for your comment! 👍 |
Setting |
For someone who happened to read across this issue: There is a way to make the import statement work under
As #622 said, it's the design of TypeScript that retains the relative import as is, and this is the main point behind this snippet. But neither TypeScript nor esbuild gave an example on the "type": "module"` scenario, so... that's it! 🤣 |
For those following along: TypeScript 4.5 is finally shipping a solution to this problem: two new file extensions, |
Will this be overridable thru IIRC, some of the reasoning for adding these file types was to better follow/analyze exports in a file. Right now, it's a bit rough to have a project that intermixes In this new world, you could still be working with |
This new behavior I was describing currently only affects the inputs to esbuild, not the outputs. So what you're saying would work fine (esbuild would still only ever generate |
That's great, thanks for the clarification :) |
Hey @evanw, maybe you already have this covered, but it sounds like one should be able to write // main.ts
import { foo } from './foo.js';
// => only "foo.ts" exists The output So, to me, Orta's thread (and the conclusion of microsoft/TypeScript#16577) is saying that when a
And this is all because Relatedly, this could be more fodder for #1652 😄 |
Here is a fully working workflow to properly transpile // yourProject/src/add.ts
export function add(a: number, b: number) {
return a + b;
} // yourProject/src/index.ts
import { add } from "./add";
console.log(add(2, 2)); Your esbuild config: // somewhere inside yourProject/build.js
{
entryPoints: ['./src/index.ts','./src/add.ts'],
outdir: './dist'
bundle: false,
platform: 'node',
target: 'node16',
format: 'esm'
} You run a build and you get those files generated in your // yourProject/dist/add.js
function add(a, b) {
return a + b;
}
export {
add
}; // yourProject/dist/index.js
import { add } from "./add";
console.log(add(2, 2)); Now, if you try to run this generated code with nodejs:
You get the
At this point, instead of jumping into the {
"name": "yourProject",
"type": "module"
} Now, if you run your program again, nodejs is now able to understand the imports, and you don't get the previous error anymore. Although you get a new error:
This is because the module loader used by nodejs requires the full path to a module to be provided to the loader (so it needs the file extension as well). Instead of adding extensions to all your imports (which leads to messing up your imports with
Now everything works fine. With this workflow, your |
This question is a continuation of #622.
What I'm trying to do is to transpile
.ts
file to.js
using esbuild as a transpiler and useesm
modules instead ofcjs
in Node.js 16. However, I don't want to bundle the code together (for now put aside whether it is a good decision), and then I encountered the same problem.Assume the file is
add.ts
The configuration is like:
After the transpilation, the result would be
add.mjs
(andindex.mjs
which has an export foradd()
)The problem is, when running the transpiled code, it would throw the error that
./index
js not found when importing files. This is because when Node.js is using esm modules, it would not resolve the extension for theimport
statements. That is, Node.js would only search for the fileindex
(but notindex.mjs
, orindex.js
with"type": "module"
) for this statement:So, is there any method to rewrite the exported
import
statement (like the above one) to followingimport
statement that works with Node.js?Thanks.
The text was updated successfully, but these errors were encountered: