System js map doesn't work

Question

Maybe I am dumb but system js always gives so much pain, although its so nice that I don't want to use anything else.

My system js config is this:

System.config({
        packages: {
            app: {
                format: 'register',
                defaultExtension: 'js'
            },
            primeng:{
                format: 'register',
                defaultExtension: 'js'
            }
        },
        map: {
          primeng: 'node_modules/primeng'
        }
    });

Primeng is being imported like this:

import {Accordion} from "primeng/primeng";
import {AccordionTab} from "primeng/primeng";

This is a ts file which gets compiled in js by gulp and then used by my index.html.

But in my terminal I get error:

error TS2307: Cannot find module 'primeng/primeng'

If anyone has any idea, please solve this

Answer 1

Figured it out.

We have to reference the type definition in the component's .ts file itself. So at the top of my component file I have to write this:

///<reference path="../../node_modules/primeng/components/accordion/accordion.d.ts"/>