Hello, We are trying to add abp packages into an Angular project that we have created as a custom. But we encountered some errors while adding these packages.
The package names we want to add are as follows:
Under the Dependencies heading: "@abp/ng.account": "~7.3.2", "@abp/ng.components": "~7.3.2", "@abp/ng.core": "~7.3.2", "@abp/ng.oauth": "~7.3.2", "@abp/ng.identity": "~7.3.2", "@abp/ng.setting-management": "~7.3.2", "@abp/ng.tenant-management": "~7.3.2", "@abp/ng.theme.shared": "~7.3.2", "@abp/ng.theme.lepton-x": "~2.3.1"
Under the devDependencies heading: "@abp/ng.schematics": "~7.3.2"
When we want to install the packages in the custom project for the first time and run the project, we encounter errors. Attached are the pictures of the errors we encountered.
https://hizliresim.com/nmu5gw5 https://hizliresim.com/gg2piqo https://hizliresim.com/ikoywtz
Enjoy your work.
12 Answer(s)
-
1
Hello,
Which angular version your custom project can you please share your @angular/* and @angular-* package's versions please ?
For ABP 7.3.x version angular versions must be
~16.0.0you can check @angular and @abp versions matrix at the templateMarkdown supported.Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post) -
1
Hi again,
That's why you getting exception. Can you please try to create empty project with @angular packages version
~16.0.0don't forget~it'll install latest patch version ex: 16.0.latestSo your project must be use Angular 16 version or you can use @abp packages old version. Please check the template folder for your version matrix
Markdown supported.Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post) -
1
You can reach the old version via changing branch or you can use tags for exac version https://github.com/abpframework/abp/blob/6b5ab21c41b12b1bee55e9e021db179109a8700a/templates/app/angular/package.json#L24-L32
Markdown supported.Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post) -
0
Hi,
requested corrections have been made. But we are getting error as below. By the way, our custom project is abp community, not commercial. We get an error like this in version I don't know what else we can do to solve the problem. The part where we get the error is abp packages for now
https://hizliresim.com/s8dnwv8 https://hizliresim.com/dliy992 https://prnt.sc/UvT7WffUnKTu
package.json
{ "name": "Demo", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve --open", "build": "ng build", "build:prod": "ng build --configuration production", "watch": "ng build --watch --configuration development", "test": "ng test", "lint": "ng lint" }, "private": true, "dependencies": { "@abp/ng.account": "~7.3.2", "@abp/ng.components": "~7.3.2", "@abp/ng.core": "~7.3.2", "@abp/ng.identity": "~7.3.2", "@abp/ng.oauth": "~7.3.2", "@abp/ng.setting-management": "~7.3.2", "@abp/ng.tenant-management": "~7.3.2", "@abp/ng.theme.lepton-x": "~2.3.1", "@abp/ng.theme.shared": "~7.3.2", "@angular/animations": "~16.0.0", "@angular/common": "~16.0.0", "@angular/compiler": "~16.0.0", "@angular/core": "~16.0.0", "@angular/forms": "~16.0.0", "@angular/localize": "~16.0.0", "@angular/platform-browser": "~16.0.0", "@angular/platform-browser-dynamic": "~16.0.0", "@angular/router": "~16.0.0", "@fullcalendar/angular": "^5.11.0", "@fullcalendar/daygrid": "^5.11.0", "@fullcalendar/interaction": "^5.11.0", "@fullcalendar/list": "^5.11.0", "@fullcalendar/timegrid": "^5.11.0", "@ng-bootstrap/ng-bootstrap": "^13.1.0", "@ng-select/ng-select": "^9.1.0", "@ngx-translate/core": "^14.0.0", "@ngx-translate/http-loader": "^7.0.0", "@ngxs/storage-plugin": "^3.7.6", "@ngxs/store": "^3.7.6", "@popperjs/core": "^2.11.6", "@sweetalert2/ngx-sweetalert2": "^11.0.0", "@types/sortablejs": "^1.15.0", "angular-cropperjs": "^1.0.2", "apexcharts": "^3.36.3", "bootstrap": "^5.2.2", "bootstrap-icons": "~1.8.3", "concurrently": "^8.2.0", "cropperjs": "^1.5.12", "devextreme": "22.1.7", "devextreme-angular": "22.1.7", "exceljs": "^4.3.0", "feather-icons": "^4.29.0", "file-saver": "^2.0.5", "file-saver-es": "^2.0.5", "jspdf": "^2.5.1", "metismenujs": "^1.3.1", "ng-apexcharts": "^1.7.4", "ng-bootstrap-icons": "^13.1.2-canary.1", "ng2-simplemde": "^2.1.0", "ngx-clipboard": "^15.1.0", "ngx-highlightjs": "^7.0.1", "ngx-owl-carousel-o": "^14.0.1", "ngx-perfect-scrollbar": "^10.1.1", "ngx-sortablejs": "^11.1.0", "ngx-toastr": "^15.0.0", "rm-datagrid": "^0.0.23", "rm-uikit": "^0.0.5", "rxjs": "7.8.1", "sortablejs": "^1.15.0", "sweetalert2": "^11.6.13", "tslib": "^2.1.0", "zone.js": "~0.13.0" }, "devDependencies": { "@abp/ng.schematics": "^6.0.3", "@angular-devkit/build-angular": "^16.2.1", "@angular-eslint/builder": "^16.1.1", "@angular-eslint/eslint-plugin": "~16.0.0", "@angular-eslint/eslint-plugin-template": "~16.0.0", "@angular-eslint/schematics": "^16.1.1", "@angular-eslint/template-parser": "~16.0.0", "@angular/cli": "~16.0.0", "@angular/compiler-cli": "~16.0.0", "@angular/language-service": "~16.0.0", "@compodoc/compodoc": "^1.1.21", "@storybook/addon-essentials": "^7.4.0", "@storybook/addon-interactions": "^7.4.0", "@storybook/addon-links": "^7.4.0", "@storybook/angular": "^7.4.0", "@storybook/blocks": "^7.4.0", "@storybook/testing-library": "^0.0.14-next.2", "@types/feather-icons": "^4.7.0", "@types/jasmine": "~3.6.0", "@types/lodash": "^4.14.197", "@types/node": "^12.11.1", "@typescript-eslint/eslint-plugin": "^5.36.2", "@typescript-eslint/parser": "^5.36.2", "eslint": "^8.23.0", "jasmine-core": "~4.0.0", "karma": "~6.3.0", "karma-chrome-launcher": "~3.1.0", "karma-coverage": "~2.1.0", "karma-jasmine": "~4.0.0", "karma-jasmine-html-reporter": "^1.7.0", "ng-packagr": "^16.2.2", "react": "^18.2.0", "react-dom": "^18.2.0", "storybook": "^7.4.0", "typescript": "~5.0.4" } }Markdown supported.Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post) -
1
Hi again,
- Your
"@abp/ng.schematics": "^6.0.3"package still got 6.x.x version it must be"~7.3.2". theme-sharedpackage uses@ng-bootstrap/ng-bootstrap, the version must be"^15.0.0"please check theme-shared package's dependency version.@ng-select/ng-selectpackage's version seems like ^9.1.0 it'll install 9.latest.latest but your angular version is 16.0.latest it must be^11.0.0
It seems like you depending a lot of package please be careful semantic versioning
Markdown supported.Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post) - Your
-
1
If you using abp on backend, why you create custom angular project with Angular CLI ? Instead using ABP CLI. I suggest to create new project with same parameters and copy angular folder to your existing project.
Markdown supported.Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post) -
0
Thank you very much . good luck, but when I tried to start the project, I saw that it could not contact some of the abp services and the page does not open. There are results in the following endpoints, we ask for your help.
Screen: https://prnt.sc/CFNzHnkHyZJi https://prnt.sc/4ZBJdqNTVwEf https://prnt.sc/iTe9MD-xrf_e https://prnt.sc/B-pHMgSdbXCA https://prnt.sc/50cag9Ut_XcN
Normally, when we request application-configuration in the api project, currentUser etc. is received without any problems, while the relevant endpoint is triggered in the custom project we created, but it comes empty.
Markdown supported.Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post) -
0
Hi again,
In your custom project, when you import CoreModule to AppModule, it'll request a few abp end-point check details
If you not authenticated with angular project app-configuration model will be null or empty which means you'll show isAuthenticated: false
I understand that you can reach any abp end-point from you custom angular project but response is not returns as expected. It's because of you not authenticated for angular client application. Can you please share a gif/video how you login on angular project ?
Markdown supported.Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post) -
0
Hello, If you are available, I can show you the working logic of the project. I can schedule a meeting with applications such as Zoom, Microsoft Teams. For this project to work, we first met with Mr. Galip and got an idea. We can hold our meeting in Turkish.
Markdown supported.Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post) -
0
Hi again,
Unfortunately I can't give a service like this, we just giving consultancy service on Mr. Galip. If you give me more details about issue I can try to help more. As I understand your previous issue versioning solved. If you can run angular application without exception which means it fixed. For other problems can you please create a new Question 🙂
Markdown supported.Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)
