Getting to Know Grunt By Writing Your Own Plugin

42
Getting to Know Grunt By Writing Your Own Plugin @jamiestrachan

Transcript of Getting to Know Grunt By Writing Your Own Plugin

Getting to Know GruntBy Writing Your Own Plugin@jamiestrachan

1. Scaffold

2a. Develop

2b. Test

3. Publish

Scaffold

Scaffold Develop Test Publish

Scaffold Develop Test Publish

Running grunt-init

Running grunt-init

?

Scaffold Develop Test Publish

“This scaffolding task was always an odd-duck, and it really

deserves it’s own project. So, we’ve broken it into a separate

npm module, grunt-init … In the coming weeks, the Yeoman

team will be replacing this task entirely, using their rails-

inspired generator system.”

February 18, 2013https://bocoup.com/weblog/tearing-grunt-apart/

Scaffold Develop Test Publish

Scaffold Develop Test Publish

README.mdScaffolded plugin

package.jsonScaffolded plugin

Develop

Scaffold Develop Test Publish

Gruntfile.jsgrunt-sass-version

tasks/sass_version.jsgrunt-sass-version

Gruntfile.jsgrunt-sass-version grunt-sass-version

tasks/sass_version.js

tasks/<plugin>.jsScaffolded plugin

tasks/lib/_sass_version.jsgrunt-sass-version

tasks/lib/_sass_version.jsgrunt-sass-version

package.jsongrunt-sass-version

Test

Scaffold Develop Test Publish

Scaffold Develop Test Publish

Code Quality

Scaffold Develop Test Publish

Unit Testing

Scaffold Develop Test Publish

Gruntfile.jsScaffolded plugin

test/<plugin>_test.jsScaffolded plugin

Scaffold Develop Test Publish

nodeunit tests

sass_version.js

lib/_sass_version.jsGrunt input Grunt output

success,

message

test/sass_version_test.jsgrunt-sass-version

Integration Testing

Scaffold Develop Test Publish

package.json

{ "dependencies" : {

"til" : "~1.2",

"elf" : "^1.2.3",

"asd" : "http://asdf.com/asdf.tar.gz",

"gitproj" : "git://github.com/user/project.git#commit-ish",

"dyl" : "file:../dyl"

} }

Scaffold Develop Test Publish

npm link

Publish

Scaffold Develop Test Publish

npm publish

Scaffold Develop Test Publish

1. register at npmjs.com

2. npm adduser

7. (npm unpublish)

So what?

Scaffolding

solid tools available: grunt-init, Yeoman

saves time

avoids mistakes

makes dull work easier

you can find existing templates or make your own

Testing

develop with testing in mind

use an automated testing tool like nodeunit

Managing Dependencies

npm link for local dependencies

git repos for unregistered dependencies

create distributed projects with npm

Contributing

process is similar for:

gulp plugins

grunt-init templates

Yeoman generators

hubot scripts

Learn your tools

Thanks!

Getting to Know Grunt By Writing Your Own Plugin

@jamiestrachan