Grunt

As discussed in previous chapters, Grunt helps in automating tedious non-functional activities such as minimization, compilation, unit testing, and linting much more easily. The Grunt ecosystem is growing rapidly, with plugins for your routine tasks including Sass, LESS, RequireJS, and CoffeeScript.

We can install grunt-cli using the following command:

npm -g install yo grunt-cli

If we are using NetBeans IDE for web application development in an Oracle JET project, the build command is essential in making the application complete, although key source files are available in the src folder. Grunt tasks, including build and serve, can be enabled within NetBeans IDE to resolve this problem by performing the following steps:

  1. Right-click on the project's root folder and select Build (as follows), which gives us the option:
  1. The preceding Build option prompts you to configure project actions to call Grunt tasks from within NetBeans IDE. Choose Yes to open the configuration window:
  1. Select all the options (checkboxes) and click OK to run Grunt commands enabled through project actions as follows:
  1. Right-click on the project root folder again and click on the build option to let Grunt build the project within the IDE, as shown in the following screenshot:

At this point, you need to be very careful. The process above has created a web folder. Essentially, developers need to make code changes in the src directory, build the application and then run the application from the web folder. Do remember this cycle and make sure you always make code changes in the src directory only, and if you make changes to the resources under the web directory, they will be lost in the next build.

Once grunt build is successful and the web directory is updated with the latest changes, we can run the grunt serve command to deploy the application and review the output on the browser.