Home » JavaScript » Case-sensitive import statements in TypeScript

About Brian De Sousa

Brian De Sousa
Brian De Sousa is a senior software developer working in the financial industry. He has over 10 years of experience developing web applications with a variety of web technologies. He has a passion for developing solutions using the latest and greatest technologies and frameworks.

Case-sensitive import statements in TypeScript

I ran into a tricky TypeScript build issue with an Angular app that would build successfully on a Windows 10 machine but failed to build on a Linux machine with a “Cannot find module” error. The cause of the problem ended up boiling down to a single case-sensitive character, “X” instead of “x”.

When I first encountered the error, I started with the basic and compared my Linux and Windows environments:

  • Confirmed the source code is identical on both machines
  • Confirmed the Node and NPM versions are identical
  • Confirmed the issue occurs even with the most basic build by removing build steps from my NPM script

Of course, instead of looking at the obvious my mind starts wandering to more complex causes. Is there something wrong with the NPM cache? I’ll force clean it. Nope, that didn’t do it. Maybe if I enable debug output, I can get additional information about the issue. Nope, nothing helpful here.

After some time, I took a closer look at the import statement:

1
import { Observable } from 'rxjs/RX'; .

The “RX” didn’t look right, but surely the build wasn’t failing due to case sensitivity. I tried try changing it anyways. Jackpot!

It turns out that import statements are case-insensitive on Mac and Windows but case-sensitive on Linux. There is a forceConsistentCasingInFileNames tsconfig.json compiler option that can help detect these sorts of issues at compile time. In my case, this option had no effect on the build however this could be because the app is still using TypeScript 2.4. There seems to be some fixes related to this compiler option in TypeScript 2.7.2.

If you have been bit by this issue too, you may want to consider adding your feedback to this open suggestion issue 21736 on the TypeScript GitHub repository.

Published on Web Code Geeks with permission by Brian De Sousa, partner at our WCG program. See the original article here: Case-sensitive import statements in TypeScript

Opinions expressed by Web Code Geeks contributors are their own.

(0 rating, 0 votes)
You need to be a registered member to rate this.
Start the discussion Views Tweet it!
Do you want to know how to develop your skillset to become a Web Rockstar?
Subscribe to our newsletter to start Rocking right now!
To get you started we give you our best selling eBooks for FREE!
1. Building web apps with Node.js
2. HTML5 Programming Cookbook
3. CSS Programming Cookbook
4. AngularJS Programming Cookbook
5. jQuery Programming Cookbook
6. Bootstrap Programming Cookbook
and many more ....
I agree to the Terms and Privacy Policy

Leave a Reply

avatar

This site uses Akismet to reduce spam. Learn how your comment data is processed.

  Subscribe  
Notify of