標籤:cordova grunt coffeescript
Cordova, Grunt and Coffee
You may reference to below if you deside to work with coffee instead of Javascript in Cordova project.
Prepare Cordova Helloworld Project
This guide is based on Hello World project which is generated by the following commands.
$ cordova create hello com.example.hello HelloWorld$ cd hello$ cordova platform add android
InstallInstall coffee Command
$ npm install -g coffee
Install grunt-contrib-coffee Grunt Plugin
$ npm install grunt-contrib-coffee --save-dev
Generate Working Tree
Transform www/js/index.js to src/www/js/index.coffee in example project. Because, we are gotta remote all the javascript file in folderwww/js/.
File src/www/js/index.coffee:
app = initialize: () -> this.bindEvents() bindEvents: () -> document.addEventListener ‘deviceready‘, this.onDeviceReady, false onDeviceReady: () -> app.receivedEvent ‘deviceready‘ receivedEvent: (id) -> parentElement = document.getElementById id listeningElement = parentElement.querySelector ‘.listening‘ receivedElement = parentElement.querySelector ‘.received‘ listeningElement.setAttribute ‘style‘, ‘display:none;‘ receivedElement.setAttribute ‘style‘, ‘display:block;‘ console.log ‘Received Event: ‘ + id
Update Gruntfile.coffee
module.exports = (grunt) -> grunt.initConfig pkg: grunt.file.readJSON ‘package.json‘ coffee: options: bare: true build: expand: true cwd: ‘src/www‘ src: [‘**/*.coffee‘] dest: ‘www‘ ext: ‘.js‘ extDot: ‘first‘ grunt.loadNpmTasks ‘grunt-contrib-coffee‘
Now We Have
src/ folder as coffee scripts location
src/www/js/index.coffee file that tranformed from www/js/index.js which is removed already.
Gruntfile.coffee build with coffee tasks
package.json which is updated with module grunt-contrib-coffee
Testing
$ grunt coffee$ cordova install android