Angular-cli: Can't use ng functionality ("node_modules appears empty")

Created on 17 Jul 2017  路  16Comments  路  Source: angular/angular-cli

Bug Report or Feature Request (mark with an x)

After installing the cli i was able to create a new project using the cli but i'm unable to use any of the
ng functionality inside my project (serve, ng g...)

Versions.

@angular/cli: 1.2.1
node: 6.11.1

Repro steps.

npm install -g @angular/cli
ng new PROJECT-NAME
cd .\PROJECT-NAME\
ng serve

The log given by the failure.

node_modules appears empty, you may need to run npm install

after running ng ---version i get the following errors:
@angular/animations: error
@angular/common: error
@angular/compiler: error
@angular/core: error
@angular/forms: error
@angular/http: error
@angular/platform-browser: error
@angular/platform-browser-dynamic: error
@angular/router: error
@angular/cli: error
@angular/compiler-cli: error
@angular/language-service: error

Mention any other details that might be useful.

-I followed exactly as instructed by the installation.

  • Uninstalled and installed nodeJS

Most helpful comment

I had the same issue but this is because i was running the command outside of the root dir. Just wanted to point that out in case someone has the same issue.

All 16 comments

I solved this issue today with this solution.

Facing the same issue. Has someone managed to resolve this?

I had the same issue but this is because i was running the command outside of the root dir. Just wanted to point that out in case someone has the same issue.

I tried @PoLaKoSz suggestion and done the following steps:
1 downloaded the cli from github
2 removed the package-lock.json from the project
3 npm install -g
4 ng new x

got the following log:

>
module.js:514
if (content.charCodeAt(0) === 35/#/ &&
^

TypeError: content.charCodeAt is not a function
at Module._compile (module.js:514:17)
at Object.require.extensions..ts (C:\Users\user\AppData\Roaming\npmnode_modules\@angular\cli\lib\bootstrap-local.js:25:14
)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
at Module.require (module.js:497:17)
at require (internal/module.js:20:19)
at Object. (C:\Users\user\AppData\Roaming\npmnode_modules\@angular\cli\packages\@angular\cli\bin\ng:7:46)
at Module._compile (module.js:570:32)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
at Module.require (module.js:497:17)
at require (internal/module.js:20:19)
at Object. (C:\Users\user\AppData\Roaming\npmnode_modules\@angular\cli\bin\ng:8:1)
at Module._compile (module.js:570:32)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
at Module.runMain (module.js:604:10)
at run (bootstrap_node.js:389:7)
at startup (bootstrap_node.js:149:9)
at bootstrap_node.js:504:3
PS C:\Users\user\Desktop\angular-cli-master> ng new x
module.js:514
if (content.charCodeAt(0) === 35/#/ &&
^

TypeError: content.charCodeAt is not a function
at Module._compile (module.js:514:17)
at Object.require.extensions..ts (C:\Users\user\AppData\Roaming\npmnode_modules\@angular\cli\lib\bootstrap-local.js:25:14
)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
at Module.require (module.js:497:17)
at require (internal/module.js:20:19)
at Object. (C:\Users\user\AppData\Roaming\npmnode_modules\@angular\cli\packages\@angular\cli\bin\ng:7:46)
at Module._compile (module.js:570:32)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
at Module.require (module.js:497:17)
at require (internal/module.js:20:19)
at Object. (C:\Users\user\AppData\Roaming\npmnode_modules\@angular\cli\bin\ng:8:1)
at Module._compile (module.js:570:32)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
at Module.runMain (module.js:604:10)
at run (bootstrap_node.js:389:7)
at startup (bootstrap_node.js:149:9)
at bootstrap_node.js:504:3``

_First sorry for my bad English._

I new in the Angular world but I really like clean things so I suggest to follow these steps to prevent more problems:

  • Uninstall every Angular thing

    • delete the files/folders what you downloaded from Angular's GitHub page.

    • type this to the terminal: $ npm uninstall -g @angular/cli

    • or go to %AppData%\npm\node_modules\ and delete the @angular folder manually

    • and the %AppData%\npm-cache\ folder too

Now you uninstalled everything which have connection with Angular (I think).

  • Install Angular CLI

    • type $ npm install -g @angular/cli (if you go back to %AppData%\npm\node_modules\ you can see the @angular folder again)

  • select the path in your terminal where you want to place your Angular project
    (for example:
    $ cd C:\xampp\htdocs\)
  • Create a new Angular app:
    $ ng new MyFirstAngularProject
  • Go inside the project:
    $ cd MyFirstAngularProject
  • Do what I suggested above:
    $ rm -rf package-lock.json node_modules && npm install
    If I am not wrong this install every Angular dependency locally so this command will create a node_modules folder inside the C:\xampp\htdocs\MyFirstAngularProject folder.
  • And after that you have to start the server to run the Angular app with the ng serve command.

I not tried but somebody will correct me if I am wrong but I think you don't have to run the
$ npm install -g @angular/cli command because you can download Angular where is an Angular project or will be.

Thanks for clearing things up @PoLaKoSz .
As far as i gathered there's no need for any other npm install then npm install -g @angular/cli, so I'm wondering whether my computer is at fault or the @angular/cli.

Has anybody find a permanent solution?

Has anybody found a permanent solution?

Install Angular CLI v1.2.2 because this is now the latest version.
Tested today and no errors.
npm install -g @angular/cli

1- cmd > run ng version , to confirm that angular CLI was installed correctly

image

2- Be Sure that you are in the right direction like
d:
cd "D:\NewApp\angular4app"
then run : ng serve

I'm having the exact same issue on a fresh install.

npm install -g @angular/cli
ng new my-app
cd my-app
ng serve

results in:
"node_modules appears empty, you may need to run 'npm install'"

ng -v gives:

@angular/cli: 1.3.2
node: 6.11.2
os: win32 x64

What am I missing?
Is this a Windows issue?

My solution:

My project was at myproject/project. I was running ng serve from my project folder without problems, but suddenly it came up with this error. I tried reinstalling angular, rebuilding my app, nothing worked.

I just ran ng serve from the folder project, and that was it.

In my case, I've created everything from Visual Studio 2017 and because of that I was misplaced.

Solution: After reading @PoLaKoSz answer, I've realized that I was in the "wrong" place as we can see bellow.

ngbuild_emptynodemodules1

After "cd NameOfMyProject" the command ng build was successfully executed.

ngbuild_emptynodemodules2

Hope it helps...
Cheers and happy new year!
daniels

I don't seem to be able to successfully import any css file in node_modules. Neither by using a relative path nor by using the ~. Imports that are in my application itself can be imported.

@import '~angular-tree-component/dist/angular-tree-component.css'; doesn't work
@import '^angular-tree-component/dist/angular-tree-component.css'; This work

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_This action has been performed automatically by a bot._

Was this page helpful?
0 / 5 - 0 ratings