If you have gotten this error or similar file permission issue on mac you can follow the steps listed in this gist to resolve the problem with node & npm. With this method of installing node you can eliminate using sudo for npm. Please follow along.
For mac here is how node, npm should be installed using nvm. This is the official nodejs.org recommendation for macbook pro. With this approach it eliminates the need of using sudo for npm and file permission issues are automatically addressed.
touch ~/.bash_profile
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash
source ~/.bash_profile
Exit the terminal and open new terminal & check nvm is installed successfully by running. This prints the version of nvm as 0.33.11.
nvm --version
Next, to see a list of available node versions run this command
nvm ls-remote
Pick the latest version and install node by running
nvm install v10.6.0
nvm use v10.6.0
nvm alias default v10.6.0
nvm current
nvm ls
Exit the terminal. Open a new terminal. Check the prefix value by running
npm config get prefix
If you still see an older location and not the one installed by nvm, then you have to set the new location as latest by running
npm config set prefix /Users/<username>/.nvm/versions/node/v10.6.0
Exit terminal & open again Check versions to see if the node & npm are installed
MacBook Pro:~ vp$ npm -v
6.1.0
MacBook Pro:~ vp$ node -v
V10.6.0
MacBook Pro:~ vp$ npm config get prefix
/Users/<username>/.nvm/versions/node/v10.6.0
See locations of node & npm installation directories on the system
MacBook Pro:~ vp$ which node
/Users/vp/.nvm/versions/node/v10.6.0/bin/node
MacBook Pro:~ vp$ which npm
/Users/vp/.nvm/versions/node/v10.6.0/bin/npm
Install angular globally (Note: DO NOT USE sudo for npm)
npm install -g @angular/cli
Change directory to your project project-abc
Remove any existing node_modules directory by running sudo rm -Rf node_modules
Git undo checkout package.json (if in case any previous changes due to npm install exist)
Remove package-lock.json and run these commands to start angular app locally. Add package-lock.json to .gitignore.
npm install
ng s
This runs the angular app on default port 4200.
If you want to run the app at a different port run this
ng s --port 4444
To upgrade npm run this command
nvm install-latest-npm
Nvm has a list of commands that are very useful
MacBookPro:angular-lab vp$ nvm
Node Version Manager
Note: <version> refers to any version-like string nvm understands. This includes:
1. full or partial version numbers, starting with an optional "v" (0.10, v0.1.2, v1)
2. default (built-in) aliases: node, stable, unstable, iojs, system
3. custom aliases you define with `nvm alias foo`
Any options that produce colorized output should respect the `--no-colors` option.
Usage:
nvm --help Show this message
nvm --version Print out the installed version of nvm
nvm install [-s] <version> Download and install a <version>, [-s] from source. Uses .nvmrc if available
--reinstall-packages-from=<version> When installing, reinstall packages installed in <node|iojs|node version number>
--lts When installing, only select from LTS (long-term support) versions
--lts=<LTS name> When installing, only select from versions for a specific LTS line
--skip-default-packages When installing, skip the default-packages file if it exists
--latest-npm After installing, attempt to upgrade to the latest working npm on the given node version
nvm uninstall <version> Uninstall a version
nvm uninstall --lts Uninstall using automatic LTS (long-term support) alias `lts/*`, if available.
nvm uninstall --lts=<LTS name> Uninstall using automatic alias for provided LTS line, if available.
nvm use [--silent] <version> Modify PATH to use <version>. Uses .nvmrc if available
--lts Uses automatic LTS (long-term support) alias `lts/*`, if available.
--lts=<LTS name> Uses automatic alias for provided LTS line, if available.
nvm exec [--silent] <version> [<command>] Run <command> on <version>. Uses .nvmrc if available
--lts Uses automatic LTS (long-term support) alias `lts/*`, if available.
--lts=<LTS name> Uses automatic alias for provided LTS line, if available.
nvm run [--silent] <version> [<args>] Run `node` on <version> with <args> as arguments. Uses .nvmrc if available
--lts Uses automatic LTS (long-term support) alias `lts/*`, if available.
--lts=<LTS name> Uses automatic alias for provided LTS line, if available.
nvm current Display currently activated version
nvm ls List installed versions
nvm ls <version> List versions matching a given <version>
nvm ls-remote List remote versions available for install
--lts When listing, only show LTS (long-term support) versions
nvm ls-remote <version> List remote versions available for install, matching a given <version>
--lts When listing, only show LTS (long-term support) versions
--lts=<LTS name> When listing, only show versions for a specific LTS line
nvm version <version> Resolve the given description to a single local version
nvm version-remote <version> Resolve the given description to a single remote version
--lts When listing, only select from LTS (long-term support) versions
--lts=<LTS name> When listing, only select from versions for a specific LTS line
nvm deactivate Undo effects of `nvm` on current shell
nvm alias [<pattern>] Show all aliases beginning with <pattern>
nvm alias <name> <version> Set an alias named <name> pointing to <version>
nvm unalias <name> Deletes the alias named <name>
nvm install-latest-npm Attempt to upgrade to the latest working `npm` on the current node version
nvm reinstall-packages <version> Reinstall global `npm` packages contained in <version> to current version
nvm unload Unload `nvm` from shell
nvm which [current | <version>] Display path to installed node version. Uses .nvmrc if available
nvm cache dir Display path to the cache directory for nvm
nvm cache clear Empty cache directory for nvm
Example:
nvm install 8.0.0 Install a specific version number
nvm use 8.0 Use the latest available 8.0.x release
nvm run 6.10.3 app.js Run app.js using node 6.10.3
nvm exec 4.8.3 node app.js Run `node app.js` with the PATH pointing to node 4.8.3
nvm alias default 8.1.0 Set default node version on a shell
nvm alias default node Always default to the latest available node version on a shell
Note:
to remove, delete, or uninstall nvm - just remove the `$NVM_DIR` folder (usually `~/.nvm`)
If you get this error run npm audit fix
rxjs_1.of is not a function
TypeError: rxjs_1.of is not a function
at WorkspaceLoader._getProjectWorkspaceFilePath (/Users/developer1011/Documents/somecompany/project_abc/Back_End/something/node_modules/@angular/cli/models/workspace-loader.js:41:27)
at WorkspaceLoader.loadWorkspace (/Users/developer1011/Documents/somecompany/project_abc/Back_End/something/node_modules/@angular/cli/models/workspace-loader.js:31:21)
at ServeCommand._loadWorkspaceAndArchitect (/Users/developer1011/Documents/somecompany/project_abc/Back_End/something/node_modules/@angular/cli/models/architect-command.js:189:32)
...
If you get this error run npm install --save @ng-bootstrap/ng-bootstrap@2.0.0
ERROR in node_modules/@ng-bootstrap/ng-bootstrap/buttons/radio.d.ts(58,96): error TS2315: Type 'ElementRef' is not generic.
node_modules/@ng-bootstrap/ng-bootstrap/datepicker/datepicker-input.d.ts(121,67): error TS2315: Type 'ElementRef' is not generic.
...