Ionic interfaces presented as modules?

Hi Peeps!
New to both Ionic and Angular here.
I’m currently trying to use an interface which i have defined under src/app/interfaces/checklists.ts as

export interface Checklist {
title: string;
items: ChecklistItem;

However, when i try to import the file as import { Checklist } from ‘…/interfaces/checklists’;,
it gives me an error TS2306 saying ‘./checklists.ts’ is not a module

any suggestions?

Three questions:

  • who exactly is “it” here that is giving the error? an IDE? if a command line, what command did you run?
  • is that the exact import? specifically, are there really three dots in a row there?
  • what is the path (relative to the project root) to the file containing the import?
  1. i’m getting the error when running ionic serve on CL. I also see errors when I inspect element on the browser.
  2. No there are no three dots. ChecklistItem is an array.
  3. I have two pages using the import. a service page and my homepage.

Try just running “ionic build” to eliminate any problems caused by stale file caching.

That’s weird, because the error you report comes from tsc, the TypeScript compiler, but by the time there are elements in a browser, tsc has already done its work and left the theatre.

I’m not asking about the contents of the file containing ChecklistItem, but rather the line that is importing it:

import { Checklist } from ‘…/interfaces/checklists’;
                           ^--- these three dots, which may in fact be a single ellipsis

Ellipses don’t belong in paths; two dots mean “up a level”.

They seem to be at different directory depths, so one is going to have to have an extra set of ../ to get to the right place - they can’t have identical import lines. Your IDE should be dealing with all this, though.

I attached a screenshot with the error message to the left. Both files are up one folder - under app in src folder. I tried to run ionic build to fix the error but it showed the same error.