Currently I'm working with the following versions:
typescript --> 2.6.2
angular --> 5.2.1
@angular/cli --> 1.6.5
After packaging my own library with some components using ng-packagr ("ng-packagr": "^1.6.0"
), I added the files created on my application inside node_modules folder but when I tried to run the application with ng serve
or ng serve --aot=false
, I get this error:
ERROR in TypeError: Cannot read property 'members' of undefined: Image with the error
The versions on the library created and the application which use that library are the same, and it seems something related with the typescript version.
I also tried to package the library with other typescript versions like 2.4.2 (this version is the most stable for angular 5) and running the application with that version also but it doesn't work.
This is the package.json from the library I want to package:
{
"name": "oc-infra",
"version": "0.0.0",
"license": "DXC",
"main": "ocinfra/index.ts",
"typings": "ocinfra/index.ts",
"scripts": {
"ng": "ng",
"start": "npm run prebuild && ng serve",
"build": "npm run prebuild && ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"doc:build": "./node_modules/.bin/compodoc -p tsconfig.json",
"doc:serve": "compodoc -s -r 4040",
"prebuild": "node utilities/metamodel-validator validateMetamodels",
"translate": "node utilities/metamodel-translator server",
"packagr": "ng-packagr -p ng-package.json"
},
"repository": {
"type": "git",
"url": "https://github.dxc.com/insurance/ui-framework.git"
},
"dependencies": {
"@angular-devkit/core": "0.0.28",
"@angular/animations": "^5.1.0",
"@angular/cdk": "^5.0.4",
"@angular/common": "^5.1.0",
"@angular/compiler": "^5.1.0",
"@angular/core": "^5.1.0",
"@angular/forms": "^5.1.0",
"@angular/http": "^5.1.0",
"@angular/material": "^5.0.4",
"@angular/platform-browser": "^5.1.0",
"@angular/platform-browser-dynamic": "^5.1.0",
"@angular/router": "^5.1.0",
"@ngui/auto-complete": "^0.16.1",
"@ngx-translate/core": "^9.1.1",
"@ngx-translate/http-loader": "^2.0.1",
"@swimlane/ngx-charts": "^7.0.1",
"@types/lodash": "^4.14.61",
"@types/node": "^9.3.0",
"ajv": "^6.0.1",
"angular-font-awesome": "^3.1.2",
"angular2-bootstrap-switch": "^0.2.3",
"bootstrap": "4.0.0",
"core-js": "^2.4.1",
"d3": "^4.10.0",
"font-awesome": "^4.7.0",
"jquery": "^3.2.1",
"jsonpath": "^1.0.0",
"lodash": "^4.17.4",
"mydatepicker": "^2.0.20",
"ng2-archwizard": "2.1.0",
"ng2-completer": "^1.5.2",
"ng2-file-upload": "^1.2.1",
"ng2-nouislider": "1.7.7",
"ngx-bootstrap": "^2.0.0-beta.11",
"ngx-modal": "0.0.29",
"ngx-pagination": "^3.0.1",
"nouislider": "^11.0.0",
"npm-font-open-sans": "^1.1.0",
"popper.js": "^1.12.9",
"rxjs": "5.5.6",
"ts-md5": "^1.2.0",
"typescript-collections": "^1.2.3",
"typings": "^2.1.1",
"zone.js": "^0.8.4"
},
"devDependencies": {
"@angular/cli": "^1.6.5",
"@angular/compiler-cli": "^5.1.0",
"@compodoc/compodoc": "^1.0.0-beta.10",
"@types/jasmine": "2.8.5",
"codelyzer": "~4.1.0",
"jasmine-core": "~2.9.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~2.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-cli": "~1.0.1",
"karma-coverage": "^1.1.1",
"karma-coverage-istanbul-reporter": "^1.1.0",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-sourcemap-loader": "^0.3.7",
"ng-packagr": "^1.6.0",
"protractor": "~5.2.2",
"remap-istanbul": "^0.10.0",
"ts-node": "~4.1.0",
"tslint": "~5.9.1",
"typescript": "^2.6.2",
"typescript-collections": "^1.2.3",
"typings": "^2.1.1",
"webpack": "^3.10.0"
}
}
And this is the package.json from the application which use the library:
{
"name": "omnichannel_starter",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve --open",
"build": "ng build --prod",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "^5.2.1",
"@angular/common": "^5.2.1",
"@angular/compiler": "^5.2.1",
"@angular/core": "^5.2.1",
"@angular/forms": "^5.2.1",
"@angular/http": "^5.2.1",
"@angular/platform-browser": "^5.2.1",
"@angular/platform-browser-dynamic": "^5.2.1",
"@angular/router": "^5.2.1",
"@ngx-translate/core": "^9.1.1",
"bootstrap": "4.0.0",
"core-js": "^2.4.1",
"font-awesome": "^4.7.0",
"jquery": "^3.2.1",
**"my-library": "my github url",**
"popper.js": "^1.13.0",
"rxjs": "^5.5.2",
"zone.js": "^0.8.14"
},
"devDependencies": {
"@angular/cli": "1.6.5",
"@angular/compiler-cli": "^5.2.1",
"@angular/language-service": "^5.2.1",
"@types/jasmine": "~2.8.5",
"@types/jasminewd2": "~2.0.2",
"@types/node": "~9.3.0",
"codelyzer": "^4.0.1",
"jasmine-core": "~2.9.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~2.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.2.2",
"ts-node": "~4.1.0",
"tslint": "~5.9.1",
"typescript": "^2.6.2"
}
}
Thanks in advance.