Sunday, August 14, 2016

Angular 2 ng serve or ng build Permissions Error

Update: If you're running macOS, you should just use Homebrew from the start and you'll likely avoid these issues.

If you grab an Angular 2 project from the web, you might find that you run into permissions errors after you install it.

For example, these commands are a common example of a simple project install. (This example uses yarn, but NPM would have similar results.) The addition of 'sudo' is common on Macs, but it can cause the permissions problem.

$ sudo npm install -g angular-cli
$ sudo npm install -g yarn
$ sudo yarn install

The problem occurs when you try to run $ ng serve (or $ ng build); you see an error such as this one:

EACCES: permission denied, open '/Users/cawood/GitHub/test/node_modules/arr-flatten/index.js'
Error: EACCES: permission denied, open '/Users/cawood/GitHub/test/node_modules/arr-flatten/index.js'
    at Error (native)
    at Object.fs.openSync (fs.js:640:18)
    at Object.fs.readFileSync (fs.js:508:33)
    at Object.Module._extensions..js (module.js:578:20)
    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. (/Users/cawood/GitHub/mix/node_modules/arr-diff/index.js:10:15) 
...  

The error occurs because the install ran as the admin user. The quick solution is to give the current user sufficient rights to the folder structure in your project. This example is heavy-handed, but it's fine for prototypes. These commands change the permissions recursively for everything (files and folders) in the test directory which is the one that contains the Angular 2 project.

$ sudo chmod -R +rwx test 
$ cd test 
$ ng serve