Navigation problem (through folders) for import

Sorry if I’m a noob, but I have this structure in my project:

src ==> pages ==> HeroesList;
src==> model ==> Hero;

How can I import my hero in the heroesList?

I tried like this:

import { Hero } from './model/hero/hero';
import { Hero } from '../model/hero/hero';
import { Hero } from '../hero/hero';
import { Hero } from '../hero';
import { Hero } from '../model/hero';

src is the root, so I guess if you’ve got


your would have to add following to import Hero.ts in HeroesList.ts

 import { Hero } from '../model/hero';

if Hero look for example like

export class Hero {

Doesn’t that work?

It says that the module …/model/hero wasn’t find…

Would you like to try to put your model under providers?


  import { Hero } from '../providers/model/hero';

Thanks for answer, I tried now but it doesn’t work… I thought it’s only a false alarm and maybe the app run without problems…

Weird I mean that’s exactly my structure

You’ve got the error when you run ionic serve right? you restarted the process after the change?

Do you really have your page right under src/pages/ not under a subfolder like src/pages/heroes or something?

The structure is:


I solved with auto-import! He write this:

import { Hero } from '../../model/hero';
1 Like

cool well done congrats

1 Like