I watched many tutorials on grunt where some min task was used. I couldn't find any plugins referring to similar task. I would guess that devs have updated it and renamed to uglify am i right? And another issue i had was the installation of grunt. Can it still be installed globally, or should i install grunt-cli globally and grunt locally in order to use it for my local projects??
This:
sudo npm install -g grunt
doesn't work for me,
only:
sudo npm install -g grunt-cli
npm install grunt --save-dev
Is the first method deprecated?
Edit:
Here is the video i'm refering to: http://www.youtube.com/watch?v=q3Sqljpr-Vc
There are many different min libraries including these by the core grunt team:
grunt-contrib-cssmin (grunt-contrib-mincss is the older version)
grunt-contrib-htmlmin
grunt-contrib-imagemin
grunt-contrib-uglify <== for js minification
It is likely the one you are referring to is the uglify plugin, but hard to tell without knowing which tutorial you were watching.
As to installing, the second form is correct for grunt 4.x as described in the documentation
I saw the same tutorial and I couldn't found min task too. 'min' seems using uglify internally so you can use uglify directly.
decalre task in gruntfile.js
uglify: {
dist: {
src: foo.js,
dest: foo.min.js
}
}
load plugin
grunt.loadNpmTasks('grunt-contrib-uglify');
and run
$ grunt uglify
Related
I'm trying to leverage from Elixer so I started to get up and running. I've installed Node and Npm. Later I also installed Gulp using sudo npm install gulp -g. But this installed Gulp in my project directory, resulting in a massive file transfer from my local host to the webserver. Is it necessary to install Gulp inside the project directory? Or is there a better way to install it somewhere else and use it for any project needed?
Sorry if this is a total beginners question but I can't seem to find an answer online. Thanks.
There is only few steps to start use it.
Install globally $ npm install --global gulp
Install directly to your project root dir $ npm install --save-dev gulp
Create gulpfile.js in root dir
Then in your new gulpfile do the follow:
var gulp = require('gulp');
gulp.task('default', function() {
// place code for your default task here
});
and after that just type gulp command in terminal to execute default task
here is documentation to help you started with gulp docs and here you can find packages to use it npmjs.com
Tip: if you on OSX use sudo to install npm/jspm/gulp etc
sudo npm install gulp -g shouldn't be installing gulp in your project directory. However, Gulp does always need to be installed locally in the project folder in order for it to work. Otherwise, you will get an error when trying to run Gulp. The -g global installion of Gulp is only needed for linking the shell to the binary $ gulp; it will dispatch to the local gulp program as soon as it is called.
Gulp, bower, ... are dependencies.
The command npm install ... will download the module to the directory named node_modules. They need to be (litterally) a part of your project. Think of it as a pure JS library (as it actually is).
I have installed the grunt using this command : npm install -g grunt-cli after i installed i am trying to fetch the grunt version using this command :
grunt --version - But i am not getting any output. what is the issue here? do i require to set the env variable or something?
please help me.
You would need to install Grunt globally as admin. Grunt docs recommend to use sudo when installing. This would be recommended for any Grunt or Gulp plugins you are installing globally. Run the same command npm install -g grunt-cli in admin command line then try grunt --version once more.
I'd recommend posting a separate question for the grunt processing as that involves much more functionality. A good example on a sample gruntfile can be found at Sample Gruntfile and includes processing js and html files for various tasks.
Let me know if that helps.
Thanks!
I was hoping that grunt-contrib-coffee could work with blackcoffee but it seems that it uses the coffee-script npm module directly instead of calling the coffee executable which would have invoked blackcoffee. I have looked around to see if there are any pre-existing Grunt plugins for blackcoffee but this doesn't seem to be the case.
Any recommendations as to how to go about configuring Grunt so that grunt watch will let me compile my blackcoffee code?
don't know if that works, but i think it should:
fork grunt-contrib-coffee
rename it in your package.json to grunt-blackcoffee
replace coffee-script dependency, and replace with blackcoffee in your package.json
search for the coffee-script require in the grunt task, currently it's here:
return require('coffee-script').compile(code, coffeeOptions);
and replace it with
return require('blackcoffee').compile(code, coffeeOptions);
publish it to npm
if you don't want to publish to npm, you can install packages from git:
$ npm install git+ssh://your-git-repo.git --save
I uninstalled grunt with following command.
npm uninstall -g grunt
Then I again installed grunt with following command.
npm install -g grunt-cli
Visit following link:
https://npmjs.org/package/grunt-html
I want to use the above grunt plugin
But when I run the grunt command it gives me following error:
D:\nodeJS\node_modules\grunt-html>grunt
grunt-cli: The grunt command line interface. (v0.1.6)
Fatal error: Unable to find local grunt.
If you're seeing this message, either a Gruntfile wasn't found or grunt
hasn't been installed locally to your project. For more information about
installing and configuring grunt, please see the Getting Started guide:
http://gruntjs.com/getting-started
All is explained quite nicely on gruntjs.com.
Note that installing grunt-cli does not install the grunt task runner!
The job of the grunt CLI is simple: run the version of grunt which has
been installed next to a Gruntfile. This allows multiple versions of
grunt to be installed on the same machine simultaneously.
So in your project folder, you will need to install (preferably) the latest grunt version:
npm install grunt --save-dev
Option --save-dev will add grunt as a dev-dependency to your package.json. This makes it easy to reinstall dependencies.
You have to install grunt in your project folder
create your package.json
$ npm init
install grunt for this project, this will be installed under node_modules/. --save-dev will add this module to devDependency in your package.json
$ npm install grunt --save-dev
then create gruntfile.js and run
$ grunt
I think you have to add grunt to your package.json file. See this link.
I had this issue on my Windows grunt because I installed the 32 bit version of Node on a 64 bit Windows OS. When I installed the 64bit version specifically, it started working.
I had the same issue today on windows 32 bit,with node 0.10.25, and grunt 0.4.5.
I followed dongho's answer, with just few extra steps.
here are the steps I used to solve the error:
1) create your package.json
$ npm init
2) install grunt for this project, this will be installed under node_modules/. --save-dev will add this module to devDependency in your package.json
$ npm install grunt --save-dev
3) then create gruntfile.js , with a sample code like this:
module.exports = function(grunt) {
grunt.initConfig({
jshint: {
files: ['Gruntfile.js', 'src/**/*.js', 'test/**/*.js'],
options: {
globals: {
jQuery: true
}
}
},
watch: {
files: ['<%= jshint.files %>'],
tasks: ['jshint']
}
});
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.registerTask('default', ['jshint']);
};
here, src/**/*.js and test/**/*.js should be the paths to actual JS files you are using in your project
4) run npm install grunt-contrib-jshint --save-dev
5) run npm install grunt-contrib-watch --save-dev
6) run $ grunt
Note: when you require common package like concat, uglify etc, you need to add those modules via npm install, just the way we installed jshint and watch in step 4 & 5
if you are a exists project, maybe should execute npm install.
guntjs getting started step 2.
This solved the issue for me. I mistakenly installed grunt using:
sudo npm install -g grunt --save-dev
and then ran the following command in the project folder:
npm install
This resulted in the error seen by the author of the question.
I then uninstalled grunt using:
sudo npm uninstall -g grunt
Deleted the node_modules folder. And reinstalled grunt using:
npm install grunt --save-dev
and running the following in the project folder:
npm install
For some odd reason when you global install grunt using -g and then uninstall it, the node_modules folder holds on to something that prevents grunt from being installed locally to the project folder.
I would like to use grunt-html task to check my HTML files.
I install the task locally with npm install grunt-html and use it in grunt.js as follows:
module.exports = function (grunt) {
grunt.loadNpmTasks('grunt-html');
grunt.initConfig({
htmllint:{
all:['*.html']
},
});
};
Now I would like to install the grunt-html task globally.
Unfortunately after removing the local grunt-html node module and installing it globally grunt fails to load the task. While running grunt htmllint I get:
>> Local Npm module "grunt-html" not found. Is it installed?
If I remove grunt.loadNpmTasks('grunt-html'); from the grunt.js file I get:
Task "htmllint" not found. Use --force to continue.
So my question is how to use grunt-html installed globally?
gruntjs doesn't currently support loading globally-installed grunt modules from loadNpmTasks, per the documentation of grunt.loadNpmTasks:
This plugin must be installed locally via npm, and must be relative to the grunt.js gruntfile.
Of course, if you really insist on installing it globally, a hack would be to create a symlink (ln -s) from your local node_modules directory to your global node_modules/grunt-html directory.
If you're doing module development, another alternative would be to use the under-appreciated npm link command that lets you locally install a module that exists elsewhere on you system (see npm help link for usage information).
Both of these approaches, though, don't allow you to truly install the grunt-html package globally.