Npm module “” not found. Is it installed?

This is strange. Using this tutorial: https://ntdln.com/2017/07/25/using-javascript-modules/ I tried to do get the modules thing in JS. I run npm istall grunt-browserify --save-dev along with the other packages. My package.json file is

{
  "name": "example",
  "version": "0.1.0",
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-preset-es2015": "^6.24.1",
    "babelify": "^8.0.0",
    "browserify": "^14.5.0",
    "grunt": "^0.4.5",
    "grunt-autoprefixer": "^3.0.4",
    "grunt-contrib-imagemin": "^2.0.1",
    "grunt-contrib-sass": "^1.0.0",
    "grunt-contrib-uglify": "^3.0.1",
    "grunt-contrib-watch": "^1.0.0",
    "grunt-es6-transpiler": "^1.0.2",
    "grunt-typescript": "^0.8.0",
    "typescript": "^2.4.2"
  }
}

So the packages are there. I tried removing my nodemodules folder and installing it with npm insatll, but it didn’t help.

My grunt.js file is this

module.exports = function (grunt) {
  // 1. All configuration goes here 
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    browserify: {
      build: {
        options: {
          browserifyOptions: {
            debug: false
          },
          transform: [
            [
              'babelify', {
                'presets': [
                  [
                    'es2015', {
                      'loose': true
                    }
                  ]
                ],
                'comments': false,
                'compact': true,
                'minified': true
              }
            ]
          ]
        },
        src: [
          '_dev/js/app.js', 
        ],
        dest: './scripts/app.es5.min.js'
      }
    },
    // es6transpiler: {
    //   dist: {
    //     files: {
    //       '_dev/js/app.es5.js': '_dev/js/app.js'
    //     }
    //   }
    // },
    // uglify: {
    //   build: {
    //     src: "_dev/js/app.es5.js",
    //     dest: "scripts/app.es5.min.js"
    //   }
    // },
    sass: {
      dist: {
        options: {
          style: 'compressed'
        },
        files: {
          '_dev/css/app.min.css': '_dev/scss/app.scss'
        }
      }
    },
    autoprefixer: {
      dist: {
        files: {
          'content/app.prefixed.min.css': '_dev/css/app.min.css'
        }
      }
    },
    imagemin: {
      dynamic: {
        files: [{
          expand: true,
          cwd: '_dev/assets/images/',
          src: ['**/*.{png,jpg,gif}'],
          dest: 'assets/img/'
        }]
      }
    },
    watch: {
      scripts: {
        files: ['_dev/js/*.js'],
        tasks: ['browserify', 'uglify'],
        options: {
          spawn: false,
        }
      },
      css: {
        files: '_dev/scss/app.scss',
        tasks: ['sass', 'autoprefixer']
      }
    } //End watch
  });

  // 3. Where we tell Grunt we plan to use this plug-in.
  grunt.loadNpmTasks('grunt-contrib-sass');
  grunt.loadNpmTasks('grunt-contrib-imagemin');
  grunt.loadNpmTasks('grunt-autoprefixer');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('browserify');
  grunt.loadNpmTasks('babelify');
  grunt.loadNpmTasks('babel-preset-es2015');
  // grunt.loadNpmTasks('grunt-contrib-uglify');
  // grunt.loadNpmTasks('grunt-es6-transpiler');
  // grunt.loadNpmTasks('grunt-contrib-requirejs');

  // 4. Where we tell Grunt what to do when we type "grunt" into the terminal.
  grunt.registerTask(
    'default', [
      // 'es6transpiler',
      // 'uglify',
      'browserify',
      'babelify',
      'babel-preset-es2015',
      'sass',
      'autoprefixer',
      'imagemin',
      'watch'
    ]);

};

Still all I’m getting after running grunt is:

>> Local Npm module "browserify" not found. Is it installed?
>> Local Npm module "babelify" not found. Is it installed?
>> Local Npm module "babel-preset-es2015" not found. Is it installed?

Answer

Use grunt browserify like below :

npm install grunt-browserify --save-dev

And after installing :

grunt.loadNpmTasks('grunt-browserify');

And same thing for other modules