I am trying to implement Ionic's social sharing plugin into my app, but I'm having issues.
This is the error I get:
Here is my component.ts
import {SocialSharing} from '#ionic-native/social-sharing/ngx';
export class SettingsPage implements OnInit {
code: string = null;
constructor(
private socialSharing: SocialSharing
) {}
ngOnInit() {}
shareCode(code) {
this.socialSharing.canShareViaEmail().then(() => {
// this.socialSharing
// .share(`Here is your code: ${code}`)
// .then(() => {
// log.debug('code has been shared?');
// });
});
}
}
Here is my package.json
{
"dependencies": {
"#angular/common": "^8.2.14",
"#angular/core": "^8.2.14",
"#angular/forms": "^8.2.14",
"#angular/http": "^7.2.16",
"#angular/platform-browser": "^8.2.14",
"#angular/platform-browser-dynamic": "^8.2.14",
"#angular/pwa": "^0.803.25",
"#angular/router": "^8.2.14",
"#angular/service-worker": "^8.2.14",
"#biesbjerg/ngx-translate-extract-marker": "^1.0.0",
"#fullcalendar/core": "^4.4.0",
"#fullcalendar/daygrid": "^4.4.0",
"#fullcalendar/interaction": "^4.4.0",
"#fullcalendar/resource-common": "^4.4.0",
"#fullcalendar/timegrid": "^4.4.0",
"#ionic-native/core": "^5.22.0",
"#ionic-native/in-app-browser": "^5.22.0",
"#ionic-native/social-sharing": "^5.22.0",
"#ionic-native/splash-screen": "^5.22.0",
"#ionic-native/status-bar": "^5.22.0",
"#ionic/angular": "^4.11.10",
"#ionic/pro": "2.0.4",
"#ionic/storage": "^2.2.0",
"#ngx-translate/core": "^12.1.2",
"#sentry/browser": "^4.6.6",
"angular2-counto": "^1.2.5",
"angularfire2": "^5.4.2",
"cordova": "^9.0.0",
"cordova-android": "^8.1.0",
"cordova-plugin-browsertab": "0.2.0",
"cordova-plugin-compat": "1.2.0",
"cordova-plugin-device": "^2.0.3",
"cordova-plugin-inappbrowser": "3.1.0",
"cordova-plugin-ionic-keyboard": "^2.2.0",
"cordova-plugin-ionic-webview": "^3.1.2",
"cordova-plugin-splashscreen": "^5.0.3",
"cordova-plugin-statusbar": "^2.4.3",
"cordova-plugin-whitelist": "^1.3.4",
"cordova-plugin-x-socialsharing": "^5.4.0",
"cordova-universal-links-plugin": "^1.2.1",
"cordova-universal-links-plugin-fix": "1.2.1",
"core-js": "^2.6.10",
"es6-promise-plugin": "^4.2.2",
"firebase": "^5.11.1",
"ionic": "^5.4.16",
"jam-icons": "^2.0.0",
"lodash": "^4.17.15",
"messageformat": "^2.3.0",
"moment": "^2.24.0",
"ngx-toastr": "^9.1.2",
"ngx-translate-messageformat-compiler": "^4.6.0",
"ngx-ui-loader": "^7.2.2",
"rxjs": "^6.5.4",
"uuid": "^3.4.0",
"web": "0.0.2",
"zone.js": "~0.9.1"
},
"devDependencies": {
"#angular-devkit/architect": "^0.803.25",
"#angular-devkit/build-angular": "^0.803.25",
"#angular-devkit/core": "^8.3.25",
"#angular-devkit/schematics": "^8.3.25",
"#angular/cli": "^8.3.25",
"#angular/compiler": "^8.2.14",
"#angular/compiler-cli": "^8.2.14",
"#angular/language-service": "^8.2.14",
"#biesbjerg/ngx-translate-extract": "^4.2.0",
"#ionic/angular-toolkit": "^2.2.0",
"#ionic/app-scripts": "^3.2.4",
"#types/jasmine": "~2.8.8",
"#types/jasminewd2": "^2.0.8",
"#types/moment": "^2.13.0",
"#types/node": "^10.17.17",
"codelyzer": "~4.5.0",
"cypress": "^3.8.3",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~3.1.4",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "^2.1.1",
"karma-jasmine": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "^5.4.3",
"ts-node": "^8.6.2",
"tslint": "~5.12.0",
"typescript": "3.5.3"
},
"description": "An Ionic project",
"cordova": {
"plugins": {
"cordova-plugin-whitelist": {},
"cordova-plugin-statusbar": {},
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-ionic-webview": {
"ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
},
"cordova-plugin-ionic-keyboard": {},
"cordova-universal-links-plugin": {},
"cordova-plugin-browsertab": {},
"cordova-plugin-inappbrowser": {},
"cordova-plugin-x-socialsharing": {
"ANDROID_SUPPORT_V4_VERSION": "24.1.1+"
}
},
"platforms": [
"android"
]
}
}
I've been trying different for several hours but I just don't know what I'm missing. Is there a special module to include or something?
Add Social Sharing to app.module.ts under providers.
import { SocialSharing } from '#ionic-native/social-sharing/ngx';
#NgModule({
declarations: [AppComponent],
entryComponents: [],
imports: [],
providers: [
...
SocialSharing,
...
],
bootstrap: [AppComponent]
})
export class AppModule {}
VERY IMPORTANT! Update for an issue in Android resolved by me ie: #dipesious
You will get an array of different packages as a .catch(error)
This means you did not add QUERY_ALL_PACKAGES permission to your manifest. Add this to your Android manifest file:
congratulations BUG RESOLVED...
Related
I have trouble deploying my project on netlify because of NPM errors.
These are my dependencies.
"dependencies": {
"#angular/animations": "~15.1.1",
"#angular/cdk": "^15.1.2",
"#angular/common": "~15.1.1",
"#angular/compiler": "~15.1.1",
"#angular/core": "~15.1.1",
"#angular/forms": "~15.1.1",
"#angular/localize": "~15.1.1",
"#angular/platform-browser": "~15.1.1",
"#angular/platform-browser-dynamic": "~15.1.1",
"#angular/router": "~15.1.1",
"#angular/service-worker": "~15.1.1",
"#googlemaps/markerclustererplus": "^1.2.3",
"#ngx-translate/core": "^13.0.0",
"#ngx-translate/http-loader": "^6.0.0",
"#uiowa/digit-only": "^2.3.0",
"angular-svg-icon": "^12.0.0",
"broadcast-channel": "^4.2.0",
"date-fns": "^2.25.0",
"hammerjs": "^2.0.8",
"ngx-device-detector": "^3.0.0",
"ngx-image-cropper": "^5.0.1",
"ngx-progressbar": "^6.1.1",
"primeflex": "^3.0.1",
"primeicons": "^4.1.0",
"primeng": "^12.2.0-rc.1",
"rxjs": "~6.6.0",
"tslib": "^2.1.0",
"zone.js": "^0.11.8"
},
"devDependencies": {
"#angular-builders/jest": "^12.1.0",
"#angular-devkit/build-angular": "~15.1.2",
"#angular-eslint/builder": "15.2.0",
"#angular-eslint/eslint-plugin": "15.2.0",
"#angular-eslint/eslint-plugin-template": "15.2.0",
"#angular-eslint/schematics": "15.2.0",
"#angular-eslint/template-parser": "15.2.0",
"#angular/cli": "~15.1.2",
"#angular/compiler-cli": "~15.1.1",
"#biesbjerg/ngx-translate-extract": "^7.0.4",
"#types/googlemaps": "^3.43.3",
"#types/jasmine": "~3.6.0",
"#types/jest": "^26.0.23",
"#types/lodash": "^4.14.172",
"#types/node": "^12.11.1",
"default-passive-events": "^2.0.0",
"eslint": "^8.28.0",
"eslint-plugin-sort-class-members": "^1.11.0",
"eslint-plugin-unused-imports": "^1.1.4",
"husky": "^6.0.0",
"jasmine-core": "~3.7.0",
"jest": "^27.0.5",
"karma-coverage": "~2.0.3",
"lint-staged": "^11.0.0",
"lodash": "^4.17.21",
"npm-run-all": "^4.1.5",
"prettier": "^2.3.1",
"ts-jest": "^29.0.5",
"typescript": "^4.9.4"
}
And when doing a simple "npm install" I get this error:
errors
I have tried looking around and following many guides but nothing seems to work, for eaxample I have already tried: These steps and many other tricks I've found when googling around
reinstall node.js: works with at least version v16.18.0
https://nodejs.org/download/release/v16.18.0/
and then use npm i --force
I was trying to install Angular Material. Then, I got this error. I deleted the node modules and I wrote npm i again. However, it's not working. How can I fix it?
When I want to run app using ng serve, I got this error:
./node_modules/ngx-print/fesm2020/ngx-print.mjs - Error: Module build failed (from ./node_modules/#angular-devkit/build-angular/src/babel/webpack-loader.js):
93 static ɵdir: i0.ɵɵDirectiveDeclaration<NgxPrintDirective, "button[ngxPrint]", never, { "previewOnly": "previewOnly"; "printSectionId": "printSectionId"; "printTitle": "printTitle"; "useExistingCss": "useExistingCss"; "printDelay": "printDelay"; "printStyle": "printStyle"; "styleSheetFile": "styleSheetFile"; }, {}, never, never, false, never>;
package.json:
{
"name": "cuba",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#agm/core": "^1.1.0",
"#angular/animations": "~13.0.3",
"#angular/cdk": "^11.0.1",
"#angular/common": "~13.0.3",
"#angular/compiler": "~13.0.3",
"#angular/core": "~13.0.3",
"#angular/fire": "^5.4.2",
"#angular/forms": "~13.0.3",
"#angular/localize": "~13.0.3",
"#angular/platform-browser": "~13.0.3",
"#angular/platform-browser-dynamic": "~13.0.3",
"#angular/router": "~13.0.3",
"#angular/service-worker": "~13.0.3",
"#asymmetrik/ngx-leaflet": "^7.0.0",
"#auth0/angular-jwt": "^5.1.0",
"#ckeditor/ckeditor5-angular": "^1.2.3",
"#ckeditor/ckeditor5-build-classic": "^20.0.0",
"#ckeditor/ckeditor5-build-inline": "^20.0.0",
"#ctrl/ngx-emoji-mart": "^3.1.0",
"#kolkov/angular-editor": "^1.1.2",
"#ks89/angular-modal-gallery": "^7.2.5",
"#ng-bootstrap/ng-bootstrap": "^6.1.0",
"#ng-select/ng-select": "^4.0.0",
"#ngx-loading-bar/core": "^5.1.0",
"#ngx-loading-bar/http-client": "^5.1.0",
"#ngx-loading-bar/router": "^5.1.0",
"#ngx-translate/core": "^13.0.0",
"#ngx-translate/http-loader": "^6.0.0",
"#sweetalert2/ngx-sweetalert2": "^8.1.1",
"#swimlane/ngx-charts": "^14.0.0",
"#swimlane/ngx-datatable": "^17.1.0",
"angular-archwizard": "^6.1.0",
"angular-calendar": "^0.28.16",
"angular-count-to": "0.0.3",
"angular-tree-component": "^8.5.6",
"angular2_photoswipe": "^8.0.1",
"angular2-knob": "^1.1.15",
"angular2-multiselect-dropdown": "^4.6.3",
"angularx-flatpickr": "^6.3.1",
"animate.css": "^4.1.0",
"apexcharts": "^3.19.3",
"bootstrap": "^4.5.2",
"canvasjs": "^1.8.3",
"chart.js": "^2.9.3",
"chartist": "^0.11.4",
"crypto": "^1.0.1",
"crypto-js": "^4.1.1",
"date-fns": "^2.14.0",
"feather-icons": "^4.26.0",
"file-saver": "^2.0.5",
"firebase": "^7.15.5",
"flatpickr": "^4.6.3",
"font-awesome": "^4.7.0",
"hammerjs": "^2.0.8",
"knob": "^1.1.0",
"leaflet": "^1.6.0",
"mousetrap": "^1.6.5",
"ng-apexcharts": "^1.3.0",
"ng-chartist": "^4.1.0",
"ng-pick-datetime": "^7.0.0",
"ng2-charts": "^2.3.2",
"ng2-dragula": "^2.1.1",
"ng2-google-charts": "^6.0.0",
"ng2-search-filter": "^0.5.1",
"ng5-slider": "^1.2.4",
"ngx-ckeditor": "^8.0.0",
"ngx-cookie-service": "^3.0.3",
"ngx-crystal-gallery": "^1.1.5",
"ngx-datatable": "^1.0.3",
"ngx-dropzone": "^2.5.0",
"ngx-dropzone-wrapper": "^9.0.0",
"ngx-editor": "^5.0.0-alpha.9",
"ngx-image-cropper": "^3.1.9",
"ngx-joyride": "^2.2.11",
"ngx-masonry": "^10.0.0",
"ngx-masonry-gallery": "^3.0.0",
"ngx-owl-carousel-o": "^3.0.1",
"ngx-perfect-scrollbar": "^9.0.0",
"ngx-print": "^1.2.0-beta.5",
"ngx-router-animations": "0.0.9",
"ngx-toastr": "^12.1.0",
"photoswipe": "^4.1.3",
"rxjs": "~6.5.5",
"sweetalert2": "^9.14.4",
"tslib": "^2.0.0",
"xlsx": "^0.18.5",
"xlsx-style": "^0.8.13",
"zone.js": "~0.11.4"
},
"devDependencies": {
"#angular-devkit/build-angular": "~13.0.4",
"#angular/cli": "~13.0.4",
"#angular/compiler-cli": "~13.0.3",
"#angular/language-service": "~13.0.3",
"#schematics/angular": "^14.2.1",
"#types/chartist": "^0.9.48",
"#types/crypto-js": "^4.1.1",
"#types/feather-icons": "^4.7.0",
"#types/hammerjs": "^2.0.36",
"#types/jasmine": "~3.5.11",
"#types/jasminewd2": "~2.0.3",
"#types/leaflet": "^1.5.13",
"#types/mousetrap": "^1.6.3",
"#types/node": "^14.18.34",
"codelyzer": "^5.2.2",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~6.3.2",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~3.3.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"ts-node": "~8.10.2",
"tslint": "~6.1.0",
"typescript": "~4.4.4"
}
}
if Angular version is from 7.0.0 - 14.1.0
use command npm i ngx-print#1.2.1
if Angular version is >14
use command npm install ngx-print
it works fine for me
Problem
In my main.js bundle there is a single massive node_module dependency that does not make sense. ngx-translate-core • 2.85MB in node_modules
Expected behaviour
The ngx-translate-core.mjs package should only be 17.5Kb according to bundlephobia: #ngx-translate/core#14.0.0.
Attempted solutions
I have tried upgrading Angular from version 12 to 13 and now to 14. When it was Angular 12 it appeared as unsupportedIterableToArray • 2.85 MB
Changing the tsconfig.module to CommonJS also caused the chunk to map to a different npm package
ngrx-store-localstorage • 2.9 MB
Is there a way to see the dependency tree that webpack uses internally in order to see what causes this to be bundled?
package.json:
"dependencies": {
"#angular/animations": "^14.2.0",
"#angular/cdk": "^14.2.0",
"#angular/common": "^14.2.0",
"#angular/compiler": "^14.2.0",
"#angular/core": "^14.2.0",
"#angular/forms": "^14.2.0",
"#angular/localize": "^14.2.0",
"#angular/material": "14.2.0",
"#angular/material-moment-adapter": "14.2.0",
"#angular/platform-browser": "^14.2.0",
"#angular/platform-browser-dynamic": "^14.2.0",
"#angular/router": "^14.2.0",
"#ng-bootstrap/ng-bootstrap": "^13.0.0",
"#ng-idle/core": "^11.1.0",
"#ng-idle/keepalive": "^11.0.3",
"#ngrx/effects": "^14.2.0",
"#ngrx/router-store": "^14.2.0",
"#ngrx/store": "^14.2.0",
"#ngrx/store-devtools": "^14.2.0",
"#ngx-translate/core": "14.0.0",
"#ngx-translate/http-loader": "^6.0.0",
"#types/lodash": "^4.14.168",
"aws-amplify": "^4.3.5",
"aws-sdk": "^2.1143.0",
"core-js": "^2.6.12",
"date-fns": "^2.28.0",
"date-fns-tz": "^1.3.4",
"eslint-plugin-unused-imports": "^2.0.0",
"html2canvas": "^1.0.0-rc.7",
"jspdf": "^2.3.1",
"jszip": "^3.5.0",
"jszip-utils": "^0.1.0",
"lodash": "^4.17.21",
"moment": "^2.29.2",
"ngrx-store-localstorage": "14.0.0",
"ngx-logger": "^4.0.6",
"ngx-photo-editor": "^0.3.6",
"pdf417-generator": "^1.0.3",
"rxjs": "7.5.6",
"stream-browserify": "^3.0.0",
"utf8": "^3.0.0",
"util": "^0.12.4",
"zone.js": "~0.11.4"
},
"devDependencies": {
"tslib": "^2.0.0",
"#angular-devkit/build-angular": "^14.2.1",
"#angular-eslint/builder": "14.0.3",
"#angular-eslint/eslint-plugin": "14.0.3",
"#angular-eslint/eslint-plugin-template": "14.0.3",
"#angular-eslint/schematics": "14.0.3",
"#angular-eslint/template-parser": "14.0.3",
"#angular/cli": "14.2.0",
"#angular/compiler-cli": "^14.2.0",
"#angular/language-service": "^14.2.0",
"#types/file-saver": "^2.0.3",
"#types/graphql": "^14.5.0",
"#types/jasminewd2": "~2.0.3",
"#types/jest": "^26.0.20",
"#types/jszip": "^3.4.1",
"#types/node": "^12.19.14",
"#typescript-eslint/eslint-plugin": "^5.36.2",
"#typescript-eslint/parser": "^5.36.2",
"canvas": "^2.7.0",
"commander": "^6.2.1",
"crypto-browserify": "^3.12.0",
"csvtojson": "^2.0.10",
"cypress-file-upload": "^5.0.8",
"dependency-cruiser": "^10.0.1",
"eslint": "^8.23.0",
"fast-csv": "^4.3.6",
"graphql": "^15.3.0",
"jasmine-spec-reporter": "~5.0.0",
"jest": "^27.3.1",
"jest-junit": "^13.0.0",
"jest-preset-angular": "^10.1.0",
"ng-packagr": "^14.2.0",
"ngx-translate-testing": "6.1.0",
"protractor": "~7.0.0",
"stream-browserify": "^3.0.0",
"ts-node": "~8.3.0",
"typescript": "~4.6.4"
},
I'm trying to update my application from angular 5 to angular 6+.
After updating a lot of packages I have this error and I'm stuck on that.
ERROR in chunk app [entry]
app.bundle.js
/home/sonyde/Documents/project/extranet/node_modules/ngx-bootstrap/esm5/ngx-bootstrap.js dc21e88b40837b73971f9f5c6a9b4b40
Unexpected token (467:27)
| function BsLocaleService() {
| this._defaultLocale = 'en';
| this._locale = new !(function webpackMissingModule() { var e = new Error("Cannot find module 'rxjs'"); e.code = 'MODULE_NOT_FOUND'; throw e; }())(this._defaultLocale);
| this._localeChange = this._locale.asObservable();
| }
ERROR in vendor.bundle.js from UglifyJs
Unexpected token: operator (!) [./node_modules/#angular/core/fesm5/core.js:4463,36][vendor.bundle.js:5560,36]
I updated angular (5.2 to 6.1), webpack (3.12.0 to 4.19.0) and rxjs (5.5.2 to 6.0.0) versions.
I don't think the error comes from uglifyjs because we already tried to remove it and the error is still there, in the console.
Does anyone have any insight on this?
My packages :
"dependencies": {
"#angular/animations": "^6.1.10",
"#angular/cdk": "^6.4.7",
"#angular/cli": "6",
"#angular/common": "^6.1.10",
"#angular/compiler": "^6.1.10",
"#angular/compiler-cli": "^6.1.10",
"#angular/core": "^6.1.10",
"#angular/forms": "^6.1.10",
"#angular/http": "^6.1.10",
"#angular/platform-browser": "^6.1.10",
"#angular/platform-browser-dynamic": "^6.1.10",
"#angular/platform-server": "^6.1.10",
"#angular/router": "^6.1.10",
"#epegzz/sass-vars-loader": "^3.3.1",
"#ngtools/webpack": "6.2.1",
"#ngx-translate/core": "^10.0.2",
"#ngx-translate/http-loader": "^3.0.1",
"#swimlane/ngx-charts": "^9.1.1",
"#types/core-js": "0.9.36",
"#types/jasmine": "2.5.38",
"#types/lodash": "ts2.0",
"#types/node": "6.0.45",
"#types/pdfjs-dist": "2.1.3",
"#types/swiper": "^3.4.3",
"#types/webpack-env": "1.12.1",
"angular2-router-loader": "0.3.4",
"angular2-template-loader": "0.6.0",
"awesome-typescript-loader": "^5.2.1",
"bootstrap-sass": "3.3.7",
"classlist.js": "^1.1.20150312",
"clean-webpack-plugin": "0.1.16",
"codelyzer": "^3.0.1",
"common-models": "2.3.2",
"conventional-changelog-cli": "^1.3.4",
"cookieconsent": "3.0.4",
"copy-webpack-plugin": "^5.0.0",
"core-js": "2.4.1",
"css-loader": "^1.0.1",
"d3": "^4.13.0",
"d3-ng2-service": "^2.2.0",
"deep-extend": "0.4.1",
"dynamic-i18n": "^1.0.5",
"extract-loader": "^5.1.0",
"extract-text-webpack-plugin": "4.0.0-beta.0",
"file-loader": "^6.2.0",
"flat": "^4.0.0",
"font-awesome": "4.7.0",
"html-webpack-exclude-assets-plugin": "^0.0.7",
"html-webpack-plugin": "3.0.0",
"htmllint": "^0.6.0",
"htmllint-cli": "^0.0.6",
"imagemin-webpack-plugin": "1.4.4",
"intl": "1.2.5",
"loader-utils": "^1.1.0",
"lodash": "4.17.2",
"mini-css-extract-plugin": "^1.3.3",
"mixgen": "1.1.7",
"moment": "^2.20.1",
"moment-range": "^3.0.3",
"ng2-pdf-viewer": "6.1.0",
"ng2-select-compat": "1.3.1",
"ngx-bootstrap": "4.3.0",
"ngx-cookieconsent": "^2.2.3",
"ngx-infinite-scroll": "^10.0.1",
"ngx-order-pipe": "^1.0.2",
"node-sass": "^4.13.1",
"node-sass-json-importer": "^3.0.2",
"parallel-webpack": "3.0.0-alpha.2",
"pdfjs-dist": "2.2.228",
"pretty-checkbox": "^3.0.3",
"raw-loader": "0.5.1",
"reflect-metadata": "0.1.8",
"release-it": "^10.0.0",
"rxjs": "6.2.2",
"sass-loader": "7.2.0",
"shelljs": "^0.7.8",
"simple-progress-webpack-plugin-with-prefix": "^1.1.1",
"sourcemapped-stacktrace": "^1.1.11",
"string-replace-loader": "2.3.0",
"style-loader": "0.23.1",
"sweetalert2": "6.6.3",
"swiper": "^3.4.2",
"to-string-loader": "^1.1.5",
"ts-loader": "^8.0.12",
"tslib": "1.10.0",
"tslint": "5.20.1",
"tslint-loader": "^3.6.0",
"typescript": "2.9.2",
"uglifyjs-webpack-plugin": "^2.2.0",
"url-loader": "0.5.7",
"web-animations-js": "2.2.2",
"webpack": "4.19.0",
"webpack-bundle-analyzer": "2.8.2",
"webpack-dev-server": "3.8.0",
"webpack-merge": "^4.1.0",
"zone.js": "0.8.29"
},
"devDependencies": {
"#angular/language-service": "^6.1.10",
"webpack-cli": "^3.3.12"
}
After Run the this command :- ionic cordova build android --aot
[12:00:25] ionic-app-script task: "build" [12:00:25] Error: The
Angular AoT build failed. See the issues above Error: The Angular AoT
build failed. See the issues above
at C:\Users\Admin\Git\olm_android\node_modules#ionic\app-scripts\dist\aot\aot-compiler.js:237:55
at step (C:\Users\Admin\Git\olm_android\node_modules#ionic\app-scripts\dist\aot\aot-compiler.js:32:23)
at Object.next (C:\Users\Admin\Git\olm_android\node_modules#ionic\app-scripts\dist\aot\aot-compiler.js:13:53)
at fulfilled (C:\Users\Admin\Git\olm_android\node_modules#ionic\app-scripts\dist\aot\aot-compiler.js:4:58)
[ERROR] An error occurred while running subprocess ionic-app-scripts.
Error Image
Error Comes After Build
ionic cordova build android --release --aot
Failed To build Apk and after normal run it will take time to load on mobile...taking to much time to load open an component
My dependencies
"dependencies": {
"#angular/animations": "^5.1.1",
"#angular/cdk": "^5.0.1",
"#angular/common": "5.2.10",
"#angular/compiler": "5.2.10",
"#angular/compiler-cli": "5.2.10",
"#angular/core": "5.2.10",
"#angular/fire": "^5.2.1",
"#angular/forms": "5.2.10",
"#angular/http": "5.2.10",
"#angular/material": "^5.0.1",
"#angular/platform-browser": "5.2.10",
"#angular/platform-browser-dynamic": "5.2.10",
"#ionic-native/core": "4.7.0",
"#ionic-native/fcm": "^4.12.2",
"#ionic-native/file": "^4.11.0",
"#ionic-native/file-opener": "^4.11.0",
"#ionic-native/file-transfer": "^4.11.0",
"#ionic-native/firebase": "^4.7.0",
"#ionic-native/firebase-messaging": "^4.11.0",
"#ionic-native/header-color": "^4.7.0",
"#ionic-native/in-app-browser": "^4.11.0",
"#ionic-native/social-sharing": "^4.20.0",
"#ionic-native/splash-screen": "4.7.0",
"#ionic-native/status-bar": "^4.7.0",
"#ionic/angular": "^4.4.2",
"#ionic/core": "^4.4.2",
"#ionic/lab": "^1.0.13",
"#ionic/pro": "1.0.20",
"#ionic/storage": "2.1.3",
"angularfire2": "^5.0.0-rc.6",
"cordova-android": "7.1.4",
"cordova-android-support-gradle-release": "^1.4.7",
"cordova-browser": "^6.0.0",
"cordova-plugin-console": "^1.1.0",
"cordova-plugin-device": "^2.0.3",
"cordova-plugin-file": "^6.0.2",
"cordova-plugin-file-opener2": "^2.2.1",
"cordova-plugin-file-transfer": "^1.7.1",
"cordova-plugin-headercolor": "^1.0.0",
"cordova-plugin-inappbrowser": "^3.1.0",
"cordova-plugin-ionic-keyboard": "^2.2.0",
"cordova-plugin-ionic-webview": "^1.2.1",
"cordova-plugin-splashscreen": "^5.0.3",
"cordova-plugin-statusbar": "^2.4.3",
"cordova-plugin-whitelist": "^1.3.4",
"cordova-plugin-x-socialsharing": "^5.6.3",
"cordova-support-android-plugin": "^1.0.1",
"cordova-support-google-services": "^1.2.1",
"es6-promise-plugin": "^4.2.2",
"firebase": "^4.12.1",
"ionic-angular": "3.9.2",
"ionic-selectable": "^3.0.3",
"ionicons": "3.0.0",
"jwt-decode": "^2.2.0",
"natives": "^1.1.6",
"ngx-qrcode2": "0.0.9",
"rxjs": "5.5.10",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.26"
},
"devDependencies": {
"#ionic/app-scripts": "3.2.4",
"#ionic/cli-plugin-cordova": "1.6.2",
"typescript": "~2.6.2"
},
"description": "An Ionic project",
"cordova": {
"plugins": {
"cordova-plugin-statusbar": {},
"cordova-plugin-headercolor": {},
"cordova-plugin-whitelist": {},
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-ionic-webview": {},
"cordova-plugin-ionic-keyboard": {},
"cordova-plugin-file-transfer": {},
"cordova-plugin-file": {},
"cordova-plugin-file-opener2": {
"ANDROID_SUPPORT_V4_VERSION": "27.+"
},
"cordova-android-support-gradle-release": {
"ANDROID_SUPPORT_VERSION": "27.+"
},
"cordova-plugin-inappbrowser": {},
"cordova-plugin-console": {},
"cordova-plugin-x-socialsharing": {
"ANDROID_SUPPORT_V4_VERSION": "24.1.1+"
}
},
"platforms": [
"browser",
"ios",
"android"
]
}
}
AdminverifyUnverify request page is declared in module so it is throwing error. Please define a component in a single place either in app.module.ts or adminverifyUnverify.module.ts.
remove it from app.module.ts if not opening it as a modal controller.
AOT compiler means [ production build ] not allowed any duplicate component to be declared in multiple places.