CLI can't find global packages or npm. Maybe wrong path config?

PhilippSonntagORGADATA commented 4 years ago

Description: Hello there, I'm currently trying to set up my dev environment on macOS Catalina 15.15.7. My problem is that the ionic cli seems to ignore the paths of my angular cli. Everytime I try to execute the ionic serve command, the cli wants me to install the angular cli because it can't find the ng command. When I try to install it it throws an exception as it can't find the npm command also.

Steps to Reproduce:

Install the latest version of nvm via the zsh on macOS
Install node version 14.15.0 (latest LTS)
Validate the node installation
Install @angular/cli via npm globally npm install -g @angular/cli
Validate @angular/cli using ng --version - Version 10.1.7
Install @ionic/cli via npm globally npm install -g @ionic/cli
Validate @ionic/cli using ionic --version - Version 6.12.1
Navigate to Ionic workspace root
Install all dependencies using npm install -r
Start Ionic/Angular dev server using ionic serve --project=<project-name>
Ionic wants me to install the angular cli as it cannot find the ng command
When I try to install it, Ionic is also unable to find the npm command
¯\(ツ)/¯

My ionic info:

Ionic:

   Ionic CLI                     : 6.12.1 (/Users/psn_local/.nvm/versions/node/v14.15.0/lib/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 5.4.1 (/Users/psn_local/development/git/project-api/Clients/node_modules/@ionic/angular)
   @angular-devkit/build-angular : 0.1001.7 (/Users/psn_local/development/git/project-api/Clients/node_modules/@angular-devkit/build-angular)
   @angular-devkit/schematics    : 10.1.7 (/Users/psn_local/development/git/project-api/Clients/node_modules/@angular-devkit/schematics)
   @angular/cli                  : 10.1.7 (/Users/psn_local/development/git/project-api/Clients/node_modules/@angular/cli)
   @ionic/angular-toolkit        : 2.3.3 (/Users/psn_local/development/git/project-api/Clients/node_modules/@ionic/angular-toolkit)

Utility:

   cordova-res : not installed
   native-run  : not installed

System:

   NodeJS : v14.15.0 (/Users/psn_local/.nvm/versions/node/v14.15.0/bin/node)
   npm    : 6.14.8
   OS     : macOS Catalina

Other Information: Things I already tried

Installation as another user
Installation of Node via the installer from the official website
Installation of Node via Homebrew
Installation of Node via nvm
Using of pnpm for global and local packages (with updated configs of ionic and ng)
Setting an alias for the ng command like here
Manually adding PATHS to the .zshrc file of the user

PhilippSonntagORGADATA commented 3 years ago

Can somebody help me here? This actively prevents me from using the cli. The $PATH environment variable is correctly set as it displays when I'm printing it out.

/Users/psn_local/.nvm/versions/node/v14.15.0/bin: is in my path which contains the binaries of ionic ionic-lab ng node_modules npx pnpx tsc webpack-cli ionic-cli-scripts ionic-v1 node npm pnpm preact tsserver webpack-dev-server.

EDIT: Found the error, going to submit a PR.

sonntag-philipp commented 3 years ago

It was an error in my project ionic.config.json. I switched from Windows to macOS and didn't notice the config used windows paths with backslashes. I think this error message is very misleading.

imhoffd commented 3 years ago

What exactly did you have in ionic.config.json that caused this issue?

sonntag-philipp commented 3 years ago

{
    "defaultProject": "first-project",
    "projects": {
        "first-project": {
            "name": "First Project",
            "integrations": {},
            "type": "angular",
            "root": "projects\\first-project"
        },
        "second-project": {
            "name": "Second Project",
            "integrations": {},
            "type": "angular",
            "root": "projects\\second-project"
        },
        "third-project": {
            "name": "Third Project",
            "integrations": {},
            "type": "angular",
            "root": "projects\\third-project"
        }
    }
}

I had to change the names but this was exactly the structure. The paths in the root properties were made on windows which didn't work on macOS.

imhoffd commented 3 years ago

Ahh, so the ENOENT was coming from a missing cwd, I'm guessing.

I'm wondering if it might be better to validate the project directory exists before we even attempt to spin up the serve CLI. I looked at your PR and realized we'd have to handle the same error in the build CLI and anywhere else we use that project directory as the cwd of the subprocess.

sonntag-philipp commented 3 years ago

Yeah exactly, sorry for missing out that information.

My first attempt was also to check the cwd, but I wasn't sure if other parameters could cause this error too, so I just ended up checking the existance of the cli command itself. I don't know if I can figure out all positions where this has to be fixed, but I could modify my changes if they are still needed.

imhoffd commented 3 years ago

I believe your PR will only realistically fix this specific issue: that the subprocess can emit an ENOENT error because of a missing cwd. Since that is the case, the logic may be simpler if we just check if that directory exists beforehand.

I thought about this a bit more and I think you were pretty close. We probably do want this check to exist when we attempt to serve/build/generate.

Here are some starting points:

I can take a look too, but it will be some time before I dig in. I'm mostly focused on Capacitor these days. Bugs in the Ionic CLI are rare, and this one looks like it will only affect devs who are using multiapp and make a typo in the project paths.

If you intend to continue with a fix, let me know if you have any questions! I'd be happy to answer them.

sonntag-philipp commented 3 years ago

Hej there, finally found some time to investigate. To prevent any false configurations, I implemented a validation for integration and project roots. I think this will handle most of the possible errors. Thanks for the help :)

When the directory is not accessible, the CLI will throw an exception like this:

ionic-team / ionic-cli

CLI can't find global packages or npm. Maybe wrong path config? #4599