Primeng: New import system fails under AOT

[MedinaGitHub]

I want to use the new turboTable but my import doesn't work

[sebaiona]

Same thing for me.

In fact, when I take this example I have the same problem too :
import {ButtonModule} from 'primeng/button';

When I updated the package I had UNMET PEER DEPENDENCY [email protected]...

Is there a particular dependy that I would need ?

PS : everything works fine If I don't import with primeng/table.

PS2: @cagataycivici I don't have any .d.ts file except primeng.d.ts in the package folder... (all .js files importing components are present though)
If I put one manually which imports the TurboTable component I can use it...

[jbgarr]

@MedinaGitHub Can you share whatever errors you're getting? That would help the debugging process I'm sure. Also what version of Angular are you using? I suspect there may be an issue when trying to use the latest version of PrimeNG with an older version of Angular (below v5.0).

[cfarver-liaison-com]

I'm seeing similar issues after upgrading. I'm using primeng 5.2.0-rc.1 and Angular 5.2.1.

I imported the new TableModule into my app.module file as described in the documentation, but the IDE (Visual Studio Code) isn't recognizing it as a component. That being said, it _is_ working in my app, so it seems like a false negative...
The error message I'm getting is:

[Angular]
'p-table' is not a known element:

1. If 'p-table' is an Angular component, then verify that it is part of this module.
2. If 'p-table' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

[cagataycivici]

It works for me at primeng-quickstart-cli, please compare;

https://github.com/primefaces/primeng-quickstart-cli

I'm unable to replicate.

[patriknil90]

@cagataycivici : With ng build --watch, everything works. When trying to ng build --prod:

Unexpected value 'TableModule in C:/www/struktur/protected/views/hyperion/node_modules/primeng/table.js' imported by the module 'ProjectModule in
C:/www/struktur/protected/views/hyperion/src/app/project/project.module.ts'. Please add a @NgModule annotation

import { TableModule } from 'primeng/table';

@NgModule({
  imports: [
    ...
    TableModule
  ]
})

-----------
package.json

"dependencies": {
    "@angular/animations": "^5.1.1",
    "@angular/cdk": "^5.0.1",
    "@angular/common": "^5.1.1",
    "@angular/compiler": "^5.1.1",
    "@angular/compiler-cli": "^5.1.1",
    "@angular/core": "^5.1.1",
    "@angular/forms": "^5.1.1",
    "@angular/http": "^5.1.1",
    "@angular/material": "^5.0.1",
    "@angular/platform-browser": "^5.1.1",
    "@angular/platform-browser-dynamic": "^5.1.1",
    "@angular/platform-server": "^5.1.1",
    "@angular/router": "^5.1.1",

    "primeng": "^5.2.0-rc.1",
}

[patriknil90]

update:
Seems like this isn't only for the TableModule for me. Tried to change import { CalendarModule } from "primeng/primeng" to be imported from "primeng/calendar" instead and got the same error there.

The problem is that I can't seem to import TableModule from "primeng/primeng" which in the Calendar case seems to fix it.

[PoTato-C]

We've got the exact same issue in a project too, with the build --prod and it happens for the Table but also if we try to import an element with the new import style 'primeng/element'

[patriknil90]

tried adding export * from './components/table/table'; to node_modules/primeng/primeng.d.ts but get the following intellisence error:

[ts] Module './components/datatable/datatable' has already exported a member named 'ScrollableView'. Consider explicitly re-exporting to resolve the ambiguity.
[ts] Module './components/datatable/datatable' has already exported a member named 'TableBody'. Consider explicitly re-exporting to resolve the ambiguity.

[patriknil90]

Okay, took another approach.

Adding the file table.d.ts in node_modules/primeng with the code

export * from './components/table/table';

made it work. Every other module than table needs to be imported from "primeng/primeng" when building with --prod.

[bias-keenly]

Having same issue. Seems to be AOT related. Building without AOT or prod flag builds ok with new 'primeng/[component_name]' pathing. With AOT need to use old pathing 'primeng/primeng' or the full path to component

[david-lee]

@bias-keenly You are right. It looks AOT issue. When I run by ng serve --aot then I got an error like Please add a @NgModule annotation. But it worked fine without '--aot' option.
I tested with import { InputTextModule } from 'primeng/inputtext';

[cagataycivici]

I've replicated the situation, thank you for the feedback. For my case it only happens on AOT build with prod. Adding d.ts files fixes this, so we'll do an 5.2.RC2 on 22nd with these changes.

[cagataycivici]

d.ts files of single modules will also be published to npm now which fixes the issue.

[scurk1415]

When will RC2 be available?

[adama357]

It just became available, and it works! Thanks! :)

[ozturki]

It does not seem to be fixed.

[ozturki]

import { TableModule } from 'primeng/table';
does not work
import { TableModule } from 'primeng/components/table/table';
works

[cagataycivici]

Sorry, we can't replicate and many users reported that issue is fixed.

[MarvinZ]

I had the same issue, and also with _MultiSelectModule_

so I had to do this:

//other prime components
import { TabViewModule } from 'primeng/primeng';
import { FieldsetModule } from 'primeng/primeng';
import { InplaceModule } from 'primeng/primeng';
import { GrowlModule } from 'primeng/primeng';

// components that caused building for prod errors...
import { TableModule } from 'primeng/components/table/table';
import { MultiSelectModule } from 'primeng/components/multiselect/multiselect';

and now it works

In Dev mode, everything works fine

[mikeplacko]

Why is it that primeng.js (and prime.d.ts) at the root of the project does not contain an export for the new Table component? It's the only module missing and perhaps is causing some of the odd behavior. It doesn't appear to be needed in my code, but its still odd that no export exists here.

[ivijan]

it is weird that in order to import TableModule I need to use
import { TableModule } from 'primeng/table';
it should be listed in main primeng importer
{ * } from 'primeng/primeng';

[slmmm]

This is still an issue experiencing with [email protected].
Is there a fix or workaround?

Is generic import from 'primeng/primeng' the solution moving forward too?