Ionic-cli: ionic serve: @ionic/app-scripts isn't installed in this project, but it is.

Created on 26 Jul 2018 · 21Comments · Source: ionic-team/ionic-cli

Description:
ionic serve: @ionic/app-scripts isn't installed in this project, but it is.
I started having the issue right after upgrading ionic-cli

Steps to Reproduce:
Update from [email protected] to [email protected]
On a project created with [email protected]

Output:

ERROR] @ionic/app-scripts is required for ionic serve to work properly.

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

        This package is required for ionic serve in ionic/angular 4 projects.

ioni
My ionic info:
I was downgrading while creating this question...Didn't see this. Sorry.
This is the info after downgrade:

cli packages: (C:\nvm\v6.14.2\node_modules)

    @ionic/cli-utils  : 1.9.2
    ionic (Ionic CLI) : 3.9.2

global packages:

    Cordova CLI : not installed
    Gulp CLI    : not installed globally

local packages:

    @ionic/app-scripts : 3.1.10
    Cordova Platforms  : none
    Ionic Framework    : ionic-angular 3.9.2

System:

    Node : v6.14.2
    npm  : 3.10.10
    OS   : Windows 10

Other Information:
When I downgraded I simply ran npm i -g [email protected]

triage

Source

tonysamperi

Most helpful comment

Thank you @devcenter

Does this solution work for anyone else, then?

rm -rf node_modules package-lock.json
npm install

imhoffd on 31 Jul 2018

👍2 🎉1

All 21 comments

Can you paste the list of files in the node_modules/.bin directory in your project?

imhoffd on 26 Jul 2018

Same here, no idea why it just started. CLI 4.

theunreal on 27 Jul 2018

List of files in node .bin:

acorn
acorn.cmd
atob
atob.cmd
autoprefixer-info
autoprefixer-info.cmd
browserslist
browserslist.cmd
build-optimizer
build-optimizer.cmd
create
create.cmd
errno
errno.cmd
esparse
esparse.cmd
esvalidate
esvalidate.cmd
har-validator
har-validator.cmd
in-install
in-install.cmd
in-publish
in-publish.cmd
ionic-app-scripts
ionic-app-scripts.cmd
js-yaml
js-yaml.cmd
json5
json5.cmd
miller-rabin
miller-rabin.cmd
mime
mime.cmd
mkdirp
mkdirp.cmd
ng-xi18n
ng-xi18n.cmd
ngc
ngc.cmd
node-gyp
node-gyp.cmd
node-sass
node-sass.cmd
nopt
nopt.cmd
not-in-install
not-in-install.cmd
not-in-publish
not-in-publish.cmd
pbjs
pbjs.cmd
purify
purify.cmd
rimraf
rimraf.cmd
rollup
rollup.cmd
sassgraph
sassgraph.cmd
semver
semver.cmd
sha.js
sha.js.cmd
sshpk-conv
sshpk-conv.cmd
sshpk-sign
sshpk-sign.cmd
sshpk-verify
sshpk-verify.cmd
strip-indent
strip-indent.cmd
tsc
tsc.cmd
tsickle
tsickle.cmd
tslint
tslint.cmd
tsserver
tsserver.cmd
uglifyjs
uglifyjs.cmd
uuid
uuid.cmd
webpack
webpack.cmd
which
which.cmd

theunreal on 27 Jul 2018

And can I see your ionic.config.json? (pasting your ionic info helps when chiming in for issues)

imhoffd on 27 Jul 2018

I am having the exact same problem. Ionic serve has been running smoothly (including directly after updating ionic-cli yesterday but after a system restart I am getting this message.

My ionic info

Ionic:

   ionic (Ionic CLI)  : 4.0.0 (C:\Users\matth\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.1.10

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : none

System:

   NodeJS : v8.11.2 (C:\Program Files\nodejs\node.exe)
   npm    : 5.6.0
   OS     : Windows 10

Environment:

   ANDROID_HOME : not set

mdodds93 on 27 Jul 2018

The fact that it says "This package is required for ionic serve in ionic/angular 4 projects." has me believe something may be incorrect with the project configuration. When someone has a chance, please copy/paste the ionic.config.json file and the scripts within package.json so I can have more insight into the projects.

imhoffd on 27 Jul 2018

This happened to me after doing ionic cordova run android on a separate terminal tab (I use VSC on Windows 10).

The way to solve this (on my end), close VSC and open it again, then ionic serve works again. If I open another terminal tab and run the run, it bugs again.

Scombr0 on 27 Jul 2018

Same problem here after updating...

roytouw on 29 Jul 2018

When someone has a chance, please copy/paste the ionic.config.json file and the scripts within package.json so I can have more insight into the projects.

imhoffd on 30 Jul 2018

I am getting the same issue after updating to 4.0.1. I have tried installing @ionic/app-scripts and it has no effect. Restarted everything and still no progress.

srobins259 on 30 Jul 2018

I will literally never be able to fix this issue unless someone reads this comment and does what I ask:

When someone has a chance, please copy/paste the ionic.config.json file and the scripts within package.json so I can have more insight into the projects.

imhoffd on 30 Jul 2018

this is my ionic.config.json

{
  "name": "Ionic-3-Green-Light",
  "integrations": {
    "cordova": {}
  },
  "type": "ionic-angular",
  "pro_id": "3fd41324"
}

and package.json

{
  "name": "ionicTemplate3",
  "author": "CSFORM",
  "version": "0.0.3",
  "homepage": "http://csform.com/",
  "private": true,
  "scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@agm/core": "1.0.0-beta.2",
    "@angular/common": "5.0.3",
    "@angular/compiler": "5.0.3",
    "@angular/compiler-cli": "5.0.3",
    "@angular/core": "5.0.3",
    "@angular/forms": "5.0.3",
    "@angular/http": "5.0.3",
    "@angular/platform-browser": "5.0.3",
    "@angular/platform-browser-dynamic": "5.0.3",
    "@ionic-native/barcode-scanner": "4.4.2",
    "@ionic-native/core": "4.4.0",
    "@ionic-native/firebase": "4.4.2",
    "@ionic-native/google-analytics": "4.4.2",
    "@ionic-native/splash-screen": "4.4.0",
    "@ionic-native/status-bar": "4.4.0",
    "@ionic/storage": "2.1.3",
    "angular2-google-maps": "0.17.0",
    "angularfire2": "5.0.0-rc.5-next",
    "cordova-android": "6.4.0",
    "cordova-plugin-compat": "^1.2.0",
    "cordova-plugin-console": "^1.1.0",
    "cordova-plugin-device": "^1.1.7",
    "cordova-plugin-firebase": "^0.1.25",
    "cordova-plugin-flashlight": "^3.2.0",
    "cordova-plugin-google-analytics": "^1.8.3",
    "cordova-plugin-spinner-dialog": "^1.3.1",
    "cordova-plugin-splashscreen": "^4.1.0",
    "cordova-plugin-statusbar": "^2.4.2",
    "cordova-plugin-vibration": "^2.1.6",
    "cordova-plugin-whitelist": "^1.3.3",
    "cordova-plugin-x-toast": "^2.6.2",
    "firebase": "4.6.2",
    "ion-affix": "1.1.0",
    "ionic-angular": "3.9.2",
    "ionic-plugin-keyboard": "^2.2.1",
    "ionicons": "3.0.0",
    "ngx-clipboard": "7.0.4",
    "phonegap-plugin-barcodescanner": "^7.1.2",
    "promise-polyfill": "6.0.2",
    "rxjs": "5.5.6",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.18"
  },
  "devDependencies": {
    "@ionic/app-scripts": "3.1.8",
    "typescript": "2.4.0"
  },
  "cordovaPlugins": [
    "cordova-plugin-whitelist",
    "cordova-plugin-console",
    "cordova-plugin-statusbar",
    "cordova-plugin-device",
    "cordova-plugin-splashscreen",
    "ionic-plugin-keyboard"
  ],
  "cordovaPlatforms": [],
  "description": "Pre-designed UI elements for Ionic 3 framework..",
  "cordova": {
    "plugins": {
      "cordova-plugin-device": {},
      "cordova-plugin-firebase": {},
      "cordova-plugin-google-analytics": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-whitelist": {},
      "ionic-plugin-keyboard": {},
      "phonegap-plugin-barcodescanner": {
        "ANDROID_SUPPORT_V4_VERSION": "27.+"
      },
      "cordova-plugin-flashlight": {},
      "cordova-plugin-spinner-dialog": {},
      "cordova-plugin-vibration": {},
      "cordova-plugin-x-toast": {},
      "cordova-plugin-console": {}
    },
    "platforms": [
      "android"
    ]
  }
}

devcenter on 31 Jul 2018

I solved my problem by deleting node_modules and do npm install

devcenter on 31 Jul 2018

Ionic:

ionic (Ionic CLI) : 4.0.2 (/usr/local/lib/node_modules/ionic)
Ionic Framework : ionic-angular 3.9.2
@ionic/app-scripts : 3.1.5

Cordova:

cordova (Cordova CLI) : not installed
Cordova Platforms : not available

System:

ios-deploy : 2.0.0
NodeJS : v8.11.3 (/usr/local/bin/node)
npm : 6.2.0
OS : macOS High Sierra
Xcode : Xcode 9.4.1 Build version 9F2000

Environment:

ANDROID_HOME : not set

ionic serve --address=localhost --no-open

[WARN] Detected locally installed Ionic CLI, but it's too old--using global CLI.

ionic-app-scripts serve --address localhost --port 8100 --livereload-port 35729 --dev-logger-port 53703 --nobrowser

[ERROR] @ionic/app-scripts is required for ionic serve to work properly.

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

This package is required for ionic serve in ionic/angular 4 projects.

When am trying to install @ionic/app-scripts using this command on mac (sudo npm install @ionic/app-scripts@latest --save-dev), once done . am running ionic serve and its throwing an error of--------------------------------------------------------------

* BUILD FAILED *

The following build commands failed:
Check dependencies
Write auxiliary files
(2 failures)
npm WARN @fimbul/[email protected] requires a peer of typescript@>= 2.7.1 || >= 3.0.0-dev || >= 3.0.0-insiders || 3.0.0-rc || >= 3.1.0-dev but none is installed. You must install peer dependencies yourself.
npm WARN @fimbul/[email protected] requires a peer of typescript@>= 2.7.1 || >= 3.0.0-dev || >= 3.0.0-insiders || 3.0.0-rc || >= 3.1.0-dev but none is installed. You must install peer dependencies yourself.

npm ERR! code ELIFECYCLE
npm ERR! errno 65
npm ERR! [email protected] preinstall: ./src/scripts/check_reqs.js && xcodebuild
npm ERR! Exit status 65
npm ERR!
npm ERR! Failed at the [email protected] preinstall script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:

npm ERR! /Users/swarajyakamalamtadikonda/.npm/_logs/2018-07-31T12_53_40_861Z-debug.log

Simultaneously when am trying to install ios-deploy using this command "sudo npm install -g ios-deploy --unsafe-perm --allow-root" , while doing ionic serve am getting app-script error,

Please help me solve this issue.
Thank you in advance.

jagdishhulsure on 31 Jul 2018

Thank you @devcenter

Does this solution work for anyone else, then?

rm -rf node_modules package-lock.json
npm install

imhoffd on 31 Jul 2018

👍2 🎉1

rm -rf node_modules
npm install

that works

umeshgame on 31 Jul 2018

Great! I'm closing this as it appears to be some weirdness with local installations from npm. The solution appears to be to do this: https://github.com/ionic-team/ionic-cli/issues/3399#issuecomment-409279484

If that solution doesn't work, let me know and I will happily re-open the issue. Thanks!

imhoffd on 31 Jul 2018

I am still getting the same error after running
rm -rf node_modules
npm instal

Nothing has changed

LindokuhleProHlubi on 1 Aug 2018

After several attempts, I have managed to solve the problems in the following way:

Opening the terminal with administrator rights
Executing the commands:
rm -rf node_modules package-lock.json
npm install
Closing the terminal
Reopening the terminal

After that, I can execute the "ionic serve" correctly

Jordi-Carrasco on 1 Aug 2018

@Jordi-Carrasco your solution works for me.

NitrofMtl on 2 Aug 2018

It is not advisable to run npm install (or many other commands) with sudo or administrator rights. Especially running npm install with admin rights, because it writes thousands of files that are not owned by your user, leading to further permission errors.

Errors that look like they're related to permission errors are caused by invalid permissions. I would amend @Jordi-Carrasco's steps by only _removing_ files and folders with administrator rights and running npm install as your own user.