Ionic: Error: Module build failed: Error: ENOENT: no such file or directory
Solution 1
This error occurred when your component can't be found with your app.module settings.
Follow these steps to solve your problem:
- Right click on your web browser and select inspect (in this case I use chrome)
- In the source tab, navigate to localhost:8100 (the default port for running ionic)
- Go to src -> pages and open corresponded page(in this case 'model')
- The name of .ts file and path must be as same as the name and path of the added import path in app.module.ts
In this case, there isn't model/ratingModel.ts
be aware : The path is case sensitive (maybe the .ts file is RatingModel)
Solution 2
Apologies, my bad. I just found another file that was importing the object with the incorrect case. It does appear as if there is no issue, and I had a bug in my code.
import { RatingModel } from '../model/RatingModel';
Richard
Updated on June 23, 2022Comments
-
Richard almost 2 years
I am using Ionic, and get the following error:
Runtime Error Uncaught (in promise): Error: Module build failed: Error: ENOENT: no such file or directory, open '/Users/richardmarais/Development/ionic/theWhoZoo/src/pages/model/ratingModel.js'
The error is a result of this line of code:
this.ratingModel = new RatingModel();
When I remove this line, I don't get the error.
ratingModel.ts
import { Injectable } from "@angular/core"; import { PersonModel } from './personModel'; import { JobModel } from './jobModel'; @Injectable() export class RatingModel { public id: number = null; public job: JobModel = null; public review: string = null; public rating: number = null; public reviewDate: number = null; public time: string = null; public person: PersonModel = null; public anonymous: number = null; constructor() { } }
Reading other forums, people are getting this error due to the case not matching in their imports, but I have checked mine, and they do match.
import { RatingModel } from '../model/ratingModel';
However, I have noticed something strange in my IDE (Visual Studio Code):
As you can see, in the search results, there are two files for the object,
ratingModel.ts
andRatingModel.ts
. But when I check the actual files system, there is only on file,ratingModel.ts
:Question
Does anyone know what and how to resolve what looks like possibly a bug or fault here?
Thanks
More info:
global packages: @ionic/cli-utils : 1.0.0 Cordova CLI : 6.4.0 Ionic CLI : 3.0.0 local packages: @ionic/app-scripts : 1.3.0 @ionic/cli-plugin-cordova : 1.0.0 @ionic/cli-plugin-ionic-angular : 1.0.0 Ionic Framework : ionic-angular 3.2.1 System: Node : v7.10.0 OS : macOS Sierra Xcode : Xcode 8.3.2 Build version 8E2002 ios-deploy : not installed ios-sim : not installed