I've successfully installed "npm" on my local machine. When it comes to installing grunt in my Gruntfile.js directory, I follow these steps:
- npm install grunt
- npm install -g grunt-cli
- grunt watch
Although the tasker is up and running, I encountered some warnings: https://i.sstatic.net/Y0FVK.jpg
Check out my gruntfile.js file below:
module.exports = function (grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
sass: {
dist: {
options: {
style: 'compact',
cacheLocation: 'assets/sass/.cache-location',
},
files: [{
'assets/css/dx-epb-admin.css': 'assets/css/scss/dx-epb-admin.scss',
'assets/css/dx-epb-public.css': 'assets/css/scss/dx-epb-public.scss',
'assets/css/dx-epb-grid.css': 'assets/css/scss/dx-epb-grid.scss',
}],
},
},
autoprefixer:{
dist: {
files: {
'assets/css/dx-epb-admin.css': 'assets/css/dx-epb-admin.css',
'assets/css/dx-epb-admin-new.css': 'assets/css/dx-epb-admin-new.css',
'assets/css/dx-epb-public.css': 'assets/css/dx-epb-public.css',
'assets/css/dx-epb-grid.css': 'assets/css/dx-epb-grid.css',
},
},
},
watch: {
scripts: {
files: ['assets/js/src/*.js'],
tasks: ['jshint', 'uglify'],
},
css: {
files: [ 'assets/css/**/*.scss', 'assets/css/*.css' ],
tasks: ['sass', 'autoprefixer', 'cssmin'],
},
},
cssmin: {
options: {
shorthandCompacting: false,
roundingPrecision: -1
},
target: {
files: {
'assets/css/dx-epb-admin.min.css': ['assets/css/dx-epb-admin.css'],
'assets/css/dx-epb-admin-new.min.css': ['assets/css/dx-epb-admin-new.css'],
'assets/css/dx-epb-public.min.css': ['assets/css/dx-epb-public.css'],
'assets/css/dx-epb-grid.min.css': ['assets/css/dx-epb-grid.css'],
}
},
},
uglify: {
target: {
files: {
'assets/js/dx-epb-admin.min.js':
[
'assets/js/src/dx-epb-admin.js',
],
'assets/js/dx-epb-admin-new.min.js':
[
'assets/js/src/dx-epb-admin-new.js',
],
'assets/js/dx-epb-admin-save.min.js':
[
'assets/js/src/dx-epb-admin-save.js',
],
'assets/js/dx-epb-control.min.js':
[
'assets/js/src/dx-epb-control.js',
],
'assets/js/dx-epb-media-upload.min.js':
[
'assets/js/src/dx-epb-media-upload.js',
],
'assets/js/dx-epb-public.min.js':
[
'assets/js/src/dx-epb-public.js',
],
'assets/js/dx-epb-tinymce-button.min.js':
[
'assets/js/src/dx-epb-tinymce-button.js',
]
},
},
},
jshint: {
all: ['Gruntfile.js', 'assets/js/scripts.js'],
},
});
grunt.loadNpmTasks('grunt-sass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.loadNpmTasks('grunt-autoprefixer');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.registerTask('default', ['watch']);
grunt.registerTask('css', ['sass', 'autoprefixer']);
grunt.registerTask('minify', ['cssmin']);
grunt.registerTask('minifyjs', ['uglify']);
};