Ng-packagr Compatibility

Ionic Framework ionic-v3
1

I’m looking to utilize a monorepo structure for the shared library components my organization creates. To expedite development, we have hosted private NPM packages that contain our shared components, such as authentication, encrypted storage, push notifications, etc.

Previously, I copied and tweaked the ionic-native scripts to get me started, but, IMO, utilizing ng-packagr would be easier.

When I try to create a sample project that contains a module with a page, I get the following error:

BUILD ERROR
node_modules/ionic-angular/components/picker/picker-component.d.ts.PickerCmp.html(13,71): : Expected 0 arguments, but got 1.
node_modules/ionic-angular/components/input/input.d.ts.TextInput.html(1,928): : Expected 0 arguments, but got 1.
node_modules/ionic-angular/components/input/input.d.ts.TextInput.html(1,961): : Expected 0 arguments, but got 1.

Error: node_modules/ionic-angular/components/picker/picker-component.d.ts.PickerCmp.html(13,71): : Expected 0 arguments, but got 1.
node_modules/ionic-angular/components/input/input.d.ts.TextInput.html(1,928): : Expected 0 arguments, but got 1.
node_modules/ionic-angular/components/input/input.d.ts.TextInput.html(1,961): : Expected 0 arguments, but got 1.

My package.json looks as follows:

{
  "name": "ionic-packagr-test",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve",
    "packagr": "ng-packagr -p ng-package.json"
  },
  "dependencies": {
    "@angular/animations": "5.2.11",
    "@angular/common": "5.2.11",
    "@angular/compiler": "5.2.11",
    "@angular/core": "5.2.11",
    "@angular/forms": "5.2.11",
    "@angular/http": "5.2.11",
    "@angular/platform-browser": "5.2.11",
    "@angular/platform-browser-dynamic": "5.2.11",
    "@ionic-native/core": "4.9.1",
    "@ionic-native/splash-screen": "4.9.1",
    "@ionic-native/status-bar": "4.9.1",
    "@ionic/storage": "^2.1.3",
    "ionic-angular": "3.9.2",
    "ionicons": "3.0.0",
    "rxjs": "^5.5.2",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.6.8",
    "@angular/cli": "^6.0.8",
    "@angular/compiler-cli": "^5.2.11",
    "@angular/language-service": "^6.0.7",
    "@ionic/app-scripts": "3.1.10",
    "@types/node": "^10.5.2",
    "ng-packagr": "^3.0.3",
    "ts-node": "^7.0.0",
    "tslint": "^5.10.0",
    "typescript": "~2.6.2"
  },
  "description": "An Ionic project"
}

Is there a specific version of ng-packagr needed for Ionic 3.9.x? Do I need to exclude the module from bundling ionic-angular? Any help would be appreciated.

2

Hi there.

I’m also having the same problem did you find any solution for this?

Thanks

3

Yes sir. It is not 100% perfect, IDEs will give false typescript errors (experimental decorator support not enabled, etc.), but all the scripts will run without error.

You can clone it from https://github.com/ehorodyski/ng-packagr-issue. Please let me know if you have any issues with it.

I’m looking to flesh this fella out to follow some better project structure guidelines (like here) but have not found the time to yet.

If you’d like, you can fork the project and help me out. I’d like to build an Ionic 3 library starter that is as close to ready for Ionic 4 as possible. Of course, I’ll give credit and rename the repo for the community to use.

My org. does a lot of fail-early, fail-often, so we tend to keep most of our business logic in sharable modules because some apps that don’t pick up traction will contain logic another app will want to utilize later on. It’s sad that Ionic never really put effort into something like this for the community, but we are the community so we can do it ourselves! :slight_smile:

4

HI.

I am way to far in development process to try and merge files with different packages now.
But I did follow this article
https://www.ionicrun.com/create-prepare-for-distribution-and-publish-an-ionic-2-or-3-component/
and it worked perfectly for me.

5

Yeah dude I hear you. Glad you found something that works! I’m trying to annoy the Ionic folks until they write some documentation on how to package our own Ionic libraries :slight_smile:

6

The link is not working anymore. how did u solve this problem? do u have anywhere in git