Capacitor and app-scripts

Hi all,

A bit of background:

I have an app which was originally built with Cordova, and has been fine as an Android app. A requirement then came about for it to be deployed to IOS, and unfortunately nomatter what I (or others) did, it simply would not run on IOS, so I made the decision to convert to capacitor, which worked for IOS but then broke the android version.

So i’ve rebuilt from scratch by creating a fresh ionic (6.11.5), angular and capacitor project. I’ve then copied across the src files from the old project, updated all the dependencies and fixed the references in the imports in the code. I’m now attempting to build it and i’ve managed to overcome many hurdles but am now stuck on an issue I cant seem to figure out.

The problem:

When running “ionic capacitor run android”, it fails due to the following error (output):

"ionic-app-scripts build --platform android
'ionic-app-scripts' is not recognized as an internal or external command,
operable program or batch file.

[INFO] Looks like @ionic/app-scripts isn't installed in this project.

       This package is required for this command to work properly."

I tried installing the package, but it depends on many older version of the packages I have so is incompatible, plus it appears that app-scripts was discontinued in Ionic 4 anyway - and i’m on version 6. I have absolutely no idea why my build command is attempting to call app-scripts and I cant seem to get it to stop, which means I cant build my app!

Here is my package.json:

{
  "name": "removed",
  "version": "removed",
  "author": "removed",
  "homepage": "removed",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "resources": "cordova-res android && node resources/generate-app-resources.js"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~9.1.6",
    "@angular/cdk": "^9.2.4",
    "@angular/common": "~9.1.6",
    "@angular/core": "~9.1.6",
    "@angular/forms": "~9.1.6",
    "@angular/material": "^9.2.4",
    "@angular/platform-browser": "~9.1.6",
    "@angular/platform-browser-dynamic": "~9.1.6",
    "@angular/router": "~9.1.6",
    "@capacitor/android": "~2.2.0",
    "@capacitor/core": "2.2.0",
    "@capacitor/ios": "~2.2.0",
    "@ionic-native/app-version": "^5.28.0",
    "@ionic-native/core": "5.1.0",
    "@ionic-native/fcm": "^5.28.0",
    "@ionic-native/geolocation": "^5.28.0",
    "@ionic-native/network": "^5.28.0",
    "@ionic-native/splash-screen": "^5.0.0",
    "@ionic-native/status-bar": "^5.0.0",
    "@ionic/angular": "^5.0.0",
    "@ionic/storage": "^2.3.0",
    "es6-promise-plugin": "~4.2.2",
    "ionic-selectable": "~4.7.1",
    "ionicons": "3.0.0",
    "moment": "^2.27.0",
    "rxjs": "~6.5.1",
    "sw-toolbox": "3.6.0",
    "tslib": "^1.13.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.901.5",
    "@angular-devkit/schematics": "^8.3.29",
    "@angular/cli": "~9.1.5",
    "@angular/compiler": "~9.1.6",
    "@angular/compiler-cli": "~9.1.6",
    "@capacitor/cli": "^2.4.0",
    "@ionic/angular-toolkit": "^2.1.1",
    "@types/node": "^12.11.1",
    "bufferutil": "~4.0.1",
    "cordova-res": "^0.15.1",
    "fibers": "3.1.0",
    "node-sass": "~4.0.0",
    "typescript": "~3.8.3",
    "utf-8-validate": "~5.0.2",
    "webpack": "4.44.1"
  },
  "description": "removed"
}

Many thanks for any and all advice anybody can provide!
Matt

"ionic-app-scripts build --platform android would indicate that your CLI is trying to run @ionic/app-scripts which could mean you have an old global CLI installed. You should first check and update with

npm uninstall -g ionic
npm install -g @ionic/cli

Thank you for my reply, i’ve been just using the Android studio and xCode simulators thus far to try and get this app out but its been a pain so would still love to get ionic serve working again (which is the same issue as here). I’ve tried uninstalling and reinstalling ionic as you’ve suggested and my CLI is version 6.11.8 and I get the same issue (that CLI version didn’t change after running those commands).

I have noticed that when I run “ionic info” I get “not installed” next to “Ionic Framework” (and @ionic/app-scripts which shouldn’t even be there). I also get the following at the beginning of the ionic info output:

[WARN] Error loading ionic-angular package.json: Error: Cannot find module 'ionic-angular/package'
[WARN] Error loading @ionic/app-scripts package.json: Error: Cannot find module '@ionic/app-scripts/package'

Many thanks!

Quick update just to let you know i’ve resolved the issue! It was my fault - in my “ionic.config.json” my “type” property was set to “ionic-angular” when it should have just been “angular”! I hope my mistake helps somebody else!

1 Like