Manage Node.js dependencies with frontend-maven-plugin

Normally, when working with the Node.js project, we usually ignore the node_modules directory, which is used to store Node.js dependencies, when committed to source code management systems such as Git, SVN because it’s not necessary. You can use the “npm install” command to install dependencies when you want to run the application on your machine. But one problem is that when you want to deploy CI/CD to your Node.js project, you need everything ready to deploy the application to production, how to automatically install the Node. .js dependencies for this? If your project uses Apache Maven, you can use a plugin called frontend-maven-plugin to do this. How is it in details? Let’s find out in this tutorial.

First, I will create a new Maven project as an example:

Manage Node.js dependencies with frontend-maven-plugin

Next, I will declare using the frontend-maven-plugin plugin as follows:

The first thing you need to know about the frontend-maven-plugin plugin is that it allows us to install Node.js into our project. This means you do not have to install Node.js on your machine.

To do this, first you need to configure the version of Node.js that you need to install:

then add the execution part with goal “install-node-and-npm” as follows:

At this point, if you run “mvn install”, you will see the results as follows:

As you can see, the frontend-maven-plugin plugin automatically downloads the version of Node.js we have declared in the <configuration> section from https://nodejs.org/dist/v9.9.0/node- v9.9.0-darwin-x64.tar.gz, then extract the downloaded file to copy the Node.js binary file as “node” into our project directory. A node directory has been created and the file “node” is contained in this directory. The “npm” library has also been downloaded and is located in the node_modules directory of the node directory:

Manage Node.js dependencies with frontend-maven-plugin

We can change the default directory, the project directory, to another directory in our project. For example, if you want to install Node.js in the target directory of the project, you can add the “installDirectory” configuration as follows:

Run again “mvn install”, you will see the results as follows:

Manage Node.js dependencies with frontend-maven-plugin

By default, the working directory of Node.js when we use the frontend-maven-plugin as we said above will be the directory of the project.

This means we are going to write code for the Node.js project in this directory and therefore the package.json file, which declares the dependencies that the Node.js project uses, will also be in this directory.

Suppose I now create a package.json file for example with the following content;

To be able to install the dependencies declared in this package.json file, we need to declare a new execution with the goal “npm” in the pom.xml file as follows:

Now if you run “mvn install”, you will see in the project directory that the node_modules directory contains all the dependencies that we declared in the package.json file and its dependencies as follows:

Manage Node.js dependencies with frontend-maven-plugin

We can also change the default working directory of Node.js by adding the “workingDirectory” configuration. For example, now I create a folder named “frontend” in the “src/main” directory, move the package.json file above to this directory and configure “workingDirectory” as follows:

Run again “mvn install”, you will see the results as follows:

Manage Node.js dependencies with frontend-maven-plugin

Add Comment