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

8
votes

I have cloned the my old project and run npm install and after that i run ionic serve

And i found this error

[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.
11
angularionic-frameworkionic2ionic3
What have you tried so far? I've used google for some research and directly found some approaches - Nico Haase
What about the solution given at stackoverflow.com/questions/41566420/…? - Nico Haase
why you haven´t selected an answer?. - Diego Osornio

11 Answers

18
votes

enter image description here

To solve the above issue following below commands :

  • npm install --rebuild
  • npm install node-sass --rebuild
  • npm install @ionic/app-scripts@latest --save
11
votes

Your question's title itself has the answer.

Try to install the following 

npm install @ionic/app-scripts@latest --save-dev
4
votes

I ran into this after updating to Ionic 4. I ended up having to downgrade.

https://github.com/ionic-team/ionic-cli/issues/3399

3
votes

delete your node_modules folder

Run: 

npm install

wait until it finishes. Now you could run your project with:

ionic serve -l
2
votes

Exit the command panel and reopen again. then its works.

2
votes

Run:

npm update

that will make everything fine.

0
votes

In addition to deleting node_modules and running npm install as mentioned by @tnfaid, I also deleted package-lock.json file just to be sure. Also ran npm audit fix, to resolve any vulnerabilities. This worked for me.

0
votes

This happened to me when I upgraded from Ionic 3 to 4. The problem is that package.json and ionic.config.json both changed from 3 to 4. So when you do your copy-paste actions you have to be careful.

Ionic.config.json type should be angular (used to be "type": "ionic-angular")

{
  "name": "myProjectName",
  "integrations": {
    "cordova": {}
  },
  "type": "angular"
}

package.json scripts now follow angular style

You may have had something like this

"scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint --bailOnLintError true",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve",
    "ionic:watch:before": "node ./bin/pre-build.js",
    "ionic:build:before": "node ./bin/pre-build.js"
},

That should now changed to standard angular in Ionic 4:

  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
0
votes

In package.json

"scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  }

delete '"ionic:serve": "ionic-app-scripts serve"', save it and execute ionic serve. It should work now. After that, you can add "ionic:serve": "ionic-app-scripts serve" back.

0
votes

Try installing by running the following command:

npm i -D -E @ionic/app-scripts
0
votes

After some research I found out that it was a permission problem.

In my case I solved it in a different way. I had to change permission and then update

sudo chown -R thiagodias:thiagodias /Documents/ionic_workspace
:~/Documents/ionic_workspace/test$ sudo npm install @ionic/app-scripts@latest