question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

If the file extension is `js` then it should be kept

See original GitHub issue

Reason

This will break the compatibility of esmodule, and inconsistent with tsc

Version

  • typescript: 4.1.3
  • typescript-transform-paths: 2.2.0

Steps to reproduce

There are 4 files in total:

// tsconfig.json
{
  "compilerOptions": {
    "target": "ES2020",
    "module": "ES2020",
    "outDir": "./dist/",
    "strict": true,
    "baseUrl": "./",
    "paths": {
      "@shared/*": [
        "src/shared/*"
      ]
    },
    "esModuleInterop": true,
    "plugins": [
      // {
      //   "transform": "typescript-transform-paths"
      // }
    ],
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  }
}
// src/index.ts
import { value } from './value.js';   // <-- './value.js' is not an error
console.log(value);
// src/value.ts
export const value = 12;
<!-- index.html -->
<body>
  <script src="dist/index.js" type="module"></script>
</body>
The output js without typescript-transform-paths

image

The output js with typescript-transform-paths

image

This causes the browser to fail to fetch the file: image

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:2
  • Comments:5

github_iconTop GitHub Comments

2reactions
nonaracommented, Jan 11, 2021

Good catch. Looks like I forgot to account for interchangeability between js/ts extensions. I should have read the issue more carefully! 😄

I corrected and narrowed the logic to apply to explicit .js and .jsx extensions. I believe that this should be broad enough. The only other possible related issue is that it will still strip an explicit .json extension, but I don’t think that would break anything with regard to esmodules. Feel free to correct me if I’m wrong!

In any case, v2.2.2 should work for you. Let me know if you have any issues.

2reactions
nonaracommented, Jan 5, 2021

Thanks for the report.

Seems that the best solution here would be to preserve extension if it’s explicitly added in the original source. I’ll try to get a fix out shortly.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How can I get file extensions with JavaScript? - Stack Overflow
(1) If a file has no extension, this will still return the file name. (2) If there is a fragment in the URL,...
Read more >
JS file - File Format Docs
JS (JavaScript) are files that contain JavaScript code for execution on web pages. JavaScript files are stored with the .js extension. Inside the...
Read more >
Provide a way to add the '.js' file extension to the end ... - GitHub
In order to use es6 modules in the browser, you need a .js file extension. However output doesn't add it. In ts: import...
Read more >
How to get file extensions using JavaScript? - GeeksforGeeks
To get file extensions using JavaScript, there are so many ways. The most useful ones are: split() and pop() method; substring() and ......
Read more >
JavaScript - How to get the extension of a filename tutorial
This tutorial will explain both ways, starting from using split() and pop() methods. Get filename extension using split() and pop() methods. To ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found