Gulp watch error (ENOSPC)

Issue:

Finally, I fixed the gulp watch error with below linux command.

Webpack-3.3

Webpack installation:

The webpack installation similar like other npm modules.

npm install --save webpack

 Above command will install the webpack locally.
If we want we can install webpack globally with above command.

npm install -g --save webpack

         Installing locally is recommended for most projects. This makes it easier to upgrade projects individually when breaking changes are introduced. Typically webpack is run via one or more npm scripts which will look for a webpack installation in your local node_modules directory.

Angular-webpack-seed setup:

 mkdir angular-webpack-seed
 cd angular-webpack-seed 
 npm init -y   // To generate the package.json
 npm install --save webpack // This will add webpack as a dev dependencies.

Loading CSS

In order to import a CSS file from within a JavaScript module, you need to install and add the style-loader and css-loader to your module configuration:

  npm install --save style-loader css-loader

@angular/cli installation.

Today, I had to spent lot of time on the "@angular/cli" installation.

My improper steps ate lot of time.

To install the "@angular/cli" in Ubuntu 16.04,  I  must had to follow the below steps.
Note: Before following below steps we should install nodeJS.

Step-1  Create a directory.

             mkdir angular2-demo

          

Step-2   Install  the angular cli globally      

            npm install -g @angular/cli 

          

Now, I'm going to create project with ng command but when I type the below command, it said ng not found.

Load css files with webpack 3.3

Here we can see  how to load the external css files with webpack.

Webpack is  automatically creates the link tag and add to our html file.
So, we can easily load the module specific css.

To play with the css files in webpack we need to install npm module named "style-loader", "css-loader" .

Install css loaders for webpack.

npm install --save style-loader css-loader

Once we are done with the installation we  can import the css file by using the below statement in js file.

import '../css/styles.css';

 From  above code,  style tag will create and all css styles are added into DOM as inline styles.

But, this is not what we want because If we take the large scale project thousands of lines css will be there.
We can't add all of them into the DOM.

[Ubuntu] npm permissions

Are you using any Debian based linux machine ?

      - If you say Yes,  you might face the permission issue with NPM.

Issue is every time I run npm command it's getting EACCESS error.
It means I have to run the command as a super user mode, but I don't like that.

             sudo npm install [module name]

I have been facing this issue from couple of days.

Finally, I decided to fix this issue.

Let's see how did I fix the issue.
  There are couple of ways to fix this issue:

1.     Change the permission to npm's default directory.
2.     Change npm's default directory to another directory.
3.     Install node with a package manager that takes care of this for you.