Скачать или смотреть How to Import ES6 Modules in TypeScript without Extensions in Node

Discover how to avoid using `.js` extensions when importing ES6 modules in TypeScript within Node.js. Enhance your coding experience with simple adjustments!
---
This video is based on the question https://stackoverflow.com/q/73449628/ asked by the user 'Edward Tanguay' ( https://stackoverflow.com/u/4639/ ) and on the answer https://stackoverflow.com/a/74534471/ provided by the user 'blvz' ( https://stackoverflow.com/u/710411/ ) at 'Stack Overflow' website. Thanks to these great users and Stackexchange community for their contributions.

Visit these links for original content and any more details, such as alternate solutions, latest updates/developments on topic, comments, revision history etc. For example, the original title of the Question was: How to force TypeScript in Node to not require .js extension when importing ES6 modules?

Also, Content (except music) licensed under CC BY-SA https://meta.stackexchange.com/help/l...
The original Question post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license, and the original Answer post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license.

If anything seems off to you, please feel free to write me at vlogize [AT] gmail [DOT] com.
---
How to Import ES6 Modules in TypeScript without Extensions in Node

Introduction

Are you working on a Node.js API using TypeScript and facing the frustrating issue of needing to include the .js extension when importing ES6 modules? This can disrupt the flow and organization of your code. Thankfully, there are ways to resolve this issue and streamline your imports for a cleaner, more efficient development experience.

In this guide, we will break down a simple solution to allow you to import modules without needing to specify the .js extension. Let's dive in!

Understanding the Problem

When you try to import your TypeScript files (which typically have a .ts extension) into another TypeScript file, including the .js extension is usually unnecessary. Yet, without it, you might encounter an error similar to:

[[See Video to Reveal this Text or Code Snippet]]

This can be seen in the following example from your code:

[[See Video to Reveal this Text or Code Snippet]]

Example Code Structure

Here's a brief overview of the files involved:

server.ts: This is your main server file that imports modules.

models.ts: This module exports an object that is imported within your server file.

[[See Video to Reveal this Text or Code Snippet]]

[[See Video to Reveal this Text or Code Snippet]]

The Solution: Modify Your Nodemon Configuration

To enable importing modules without the .js extension, you'll need to configure Node.js correctly. Here’s how you can accomplish that:

Step-by-Step Guide

Update the Exec Command in nodemon.json: You will instruct Node.js to stop requiring the file extensions when importing. To do this, modify the exec property in your nodemon.json configuration file.

Use Experimental Flags: Specifically, you will use the --experimental-specifier-resolution=node flag. This tells Node to resolve imports without requiring the extensions.

Here’s how your nodemon.json should look after these changes:

[[See Video to Reveal this Text or Code Snippet]]

Explanation of the Changes

--experimental-specifier-resolution=node: This flag allows Node.js to resolve specifiers without file extensions, which is exactly what you need.

--loader ts-node/esm: This tells Node to use ts-node as the loader for the TypeScript files.

Conclusion

By following the steps outlined here, you will be able to import your ES6 modules in TypeScript without needing to append the .js extension. This makes your code cleaner and more intuitive. You can now continue developing your Node.js API without any hindrance related to import statements.

If you have any more questions or need further clarification, feel free to comment below or reach out! Happy coding!