I recently encountered a very strange problem after trying out a new feature released in the April 2018 (v1.23) update to Visual Studio Code.
My app is using Ionic 3 with Angular 4. I noticed that one of the new features of VS Code was Run Code Actions on save. The example given in the documentation referred to using it to organise Typescript / JavaScript imports.
Feeling excited to give this a go, I turned on the feature, made a few changes to the app, saved my code and ran ionic serve . Then hell broke loose.
Suddenly I was getting undefined imported by MODULE errors from Angular. I spent roughly 3 hours trying to work out what was going wrong. I looked through all my import statements, all my @NgModule definitions. I couldn’t find any issue. I even ran SonarTS to see if the static analysis might bring up some issue.
Nothing helped. I then decided to stash my changes in git, checkout a new branch, pop the changes and revert one by one, every file where VS Code cleaned up my imports.
After doing this, my app ran again without issue. From what I can tell, the organising of the imports that was done automatically caused an issue where a module was trying to use another module before it had been declared, causing it to become undefined.
TL;DR
Be careful with VS Code auto organise imports on save as it may cause dependency and module resolution issues.
