Cannot read property 'bindingStartIndex' of null | ionic & angular

Question

test1 is my angular library and appOne & appTow is my ionc+angular application. I want to share the test1 library in my all application. but I can't do that. please help me

Error

Workspace structure

this is ionic.config.json of the workspace root directory

    {
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "module": "esnext",
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "lib": [
      "es2018",
      "dom"
    ],
    "paths": {
      "test1": [
        "dist/test1/test1",
        "dist/test1"
      ]
    }
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

this ionic.config.json of the app root directory

    {
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "module": "esnext",
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "lib": [
      "es2018",
      "dom"
    ],
    "paths": {
      "test1": [
        "../../dist/test1/test1",
        "../../dist/test1"
      ]
    }
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

this home module

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { IonicModule } from '@ionic/angular';
import { FormsModule } from '@angular/forms';
import { HomePage } from './home.page';

import { HomePageRoutingModule } from './home-routing.module';
import { Test1Module } from 'test1';

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    HomePageRoutingModule,
    Test1Module
  ],
  declarations: [HomePage]
})
export class HomePageModule {}

this is home component

 <ion-header [translucent]="true">
      <ion-toolbar>
        <ion-title>
          Blank
        </ion-title>
      </ion-toolbar>
    </ion-header>
    
    <ion-content [fullscreen]="true">
      <ion-header collapse="condense">
        <ion-toolbar>
          <ion-title size="large">Blank</ion-title>
        </ion-toolbar>
      </ion-header>
    
      <div id="container">
        <lib-test1></lib-test1>
        <strong>Ready to create an app?</strong>
        <p>Start with Ionic <a target="_blank" rel="noopener noreferrer" 
       href="https://ionicframework.com/docs/components">UI Components</a></p>
      </div>
    </ion-content>

please help me

Answer 1

First, there are two tsconfig.json files are shared not ionic.config.json files.

Second, to fix the issue the tsconfig.json of the app should be updated as

"paths": {
  "@angular/*": [
    "./node_modules/@angular/*"
  ],
  "test1": [
    "../test1/src/public-api"
  ]
}

Link to the discussion and solution https://github.com/angular/angular/issues/35586#issuecomment-630774572

Answer 2

if you put it in your app component it will be shared through the entire app. Good Luck!