How to Add a Script to Minify your JavaScript in a package.json file

Recently I was working on a project where I wanted to set up a process that could combine and minify the JavaScript I had in a specific folder for a project. So how did I do it?

I decided to run the npm init command on my project folder. Within the package.json file, I had the following:

{
  "main": "scripts.js",
  "scripts": {
  "minify": "uglifyjs ./js/* -o scripts.min.js",
  "uglify": "npm run minify"
},
  "dependencies": {
  "uglify-js": "^2.8.8"
},
  "devDependencies": {
  "uglify-js": "^2.8.8"
 }
}

Once I ran npm install uglify-js --save, I made sure to specify the folder I wanted to run the process in (./js/*), and the file I wanted to create with the minified code (scripts.min.js). Next, all I had to do was run npm run uglify and my new scripts.min.js minified file was created.

Now whenever I make changes or add new files to my project’s JavaScript folder, I can run npm run uglify to bundle up and minify the code.

Leave a Reply