Grunt Tutorial 5: Creating Plugins, installing grunt, and frequently asked questions

Creating plugins

There are several main steps to creating a plugin:

(1) Install grunt-init via NPM install-g grunt-init command.
(2) Install the grunt plug-in template via the git clone git://github.com/gruntjs/grunt-init-gruntplugin.git ~/.grunt-init/gruntplugin command.
(3) Execute Grunt-init gruntplugin in an empty directory.
(4) Execute the NPM install command to prepare the development environment.
(5) Write code for your plugin (task).
(6) Perform the NPM Publish command to publish the Grunt plugin (Task) you created to npm!

Note: Your task name ,the "Grunt-contrib" namespace is reserved for task use maintained by the Grunt team, please give your own task a proper name and avoid using the reserved namespace.

Grunt hides the error stack traces by default, but it can be enabled by the--stack parameter, which allows you to debug your own task. If you want Grunt to always record the stack trace in the event of an error, you can create a command alias in your Shell (alias). For example, in bash, you can create an alias by using the alias grunt= ' grunt--stack ' command. This way, when you execute grunt, you are actually performing grunt--stack.

By default, the directory that contains the Gruntfile file is set to the current working directory. Users can change the current working directory by executing grunt.file.setBase () in their gruntfile.

Installing grunt

The Grunt and Grunt plug-ins should be defined in the Devdependencies section of the project's Package.json file. This allows you to install the module on which the current project depends by using a command: NPM install. Both the stable and development versions of the current Grunt are listed on the project's wiki page.

If you need a specific version of the Grunt or Grunt plugin, execute the npm install [email protected] --save-dev command, which VERSION represents the version you need. This completes the installation and adds it to the Devdependencies section in the Package.json file. The version range that appears in the Package.json file will be the wavy line marker.

As new features are developed, Grunt is regularly posted on NPM. If you do not specify a version number, this version of the build is not installed at all.

So we have to specify the version, as with the installation of the specified version of Grunt, to execute the NPM install [email protected]--save-dev command, where version is the one you specified, NPM will install this version of Grunt in the project directory, and add it to the Devdependencies section in the Package.json file.

Note that no matter what version you specify, it will be added to the Package.json file according to the version range marked by the wavy line. This is a great hazard, and when a new version of the specified development version, especially an incompatible patch version, is installed by NPM, it is possible to disrupt your project so that it cannot be compiled.

Once this happens, the most important thing is to manually edit the Package.json file and remove the ~ (tilde) from the version number. This will enable you to lock into a specific development version that you have specified. This technique can also be used to install the developed version of the Grunt plugin that has been released.

Of course, you can also install directly from GitHub, which will ensure that your project always uses an exact version of grunt.

Problems

Can grunt work on Windows?

Grunt can work well on Windows because node. js and NPM work well on Windows. Typically, the problem is Cygwin because it is tied to an older version of node. js.

The best way to avoid this problem is to use Msysgit installer to install binary git and use node. JS Installer to install binary node and NPM, and then use the built-in Windows command prompt or PowerShell to replace Cygwin.

How do I enable the TAB key Auto-completion feature in the shell?
In order to add the tab auto-completion function to grunt, the following line of code can be added to your ~/.BASHRC file:

Eval "$ (grunt--completion=bash)"
Of course, you've already used NPM install-g grunt to install the grunt globally, because grunt currently only supports bash commands.

How do I make multiple tasks share parameters?
Although each task can use its own parameters, there are several methods that allow you to share parameters in multiple tasks.

(1) "Dynamic" task aliases

This is the preferred method for multiple task sharing parameters

An ordinary task can be executed using the Grunt.task.run method. In the following example, the grunt build:001 is executed at the command line, and the final effect is to perform the three tasks of foo:001, bar:001, and baz:001.

function (n) {  ifnull) {grunt.warn (' Build num must is specified, like build:001. ')　　); } grunt.task.run (' foo: ' + N, ' bar: ' + N, ' baz: ' + n ');});

(2) Options

Multiple tasks can share parameters in a way that uses grunt.option. In the following example, executing grunt deploy--target=staging on the command line will let Grunt.option (' target ') return "staging".

function　　(n) {  var target = grunt.option (' target ');  // do something useful with targethere}); Grunt.registertask (' deploy ', [' Validate ', ' Upload ']);

Note that a parameter of the Boolean type can use a key that has no value. For example, executing grunt deploy--staging on the command line causes grunt.option (' staging ') to return true.

(3) Global and configuration

In other cases, you might want to expose a configured value or a global value. In this case, you can set its parameters as the value of a global object or the value of a project configuration when registering a task.

In the following example, running grunt Set_global:name:peter set_config:target:staging deploy at the command line results in a global.name value of "Peter" and Grunt.config (' target ') will return "staging". Therefore, the deploy task can use these values.

function= val;}); Grunt.registertask (function(name, Val) {grunt.config.set (name, Val);});

Why do I get an error that the call stack size exceeds the maximum value?
You may have created an alias task with an ordinary task name, such as: Grunt.registertask (' uglify ', [' uglify:my_target ']); Should be changed to: Grunt.registertask (' myuglify ', [' uglify:my_target ']);.

How can I remove a plugin I don't want?
There are at least two ways to resolve this:

The first approach is to remove this command from the NPM remove [Grunt_plugin]--save-dev, which will be removed from your Package.json file and the node module package.

You can also remove the plugin from the Package.json file and run NPM prune.

In Windows Grunt 0.3, why did my JS editor open when I tried to run Grunt?

If you are in the directory where Gruntfile is located, Windows will try to execute that file when you enter grunt. So you need to enter Grunt.cmd.

Another option is to use the Doskey command to create a grunt macro so that you can use grunt instead of grunt.cmd.

You can use the DOSKEY command shown below: DOSKEY grunt=grunt.cmd $*

Come on!

Grunt Tutorial 5: Creating Plugins, installing grunt, and frequently asked questions