码迷,mamicode.com
首页 > 其他好文 > 详细

Get Cordova Ready for Grunt and CoffeeScript

时间:2014-06-27 08:13:42      阅读:230      评论:0      收藏:0      [点我收藏+]

标签: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

Install

Install 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 folder www/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

Get Cordova Ready for Grunt and CoffeeScript,布布扣,bubuko.com

Get Cordova Ready for Grunt and CoffeeScript

标签:cordova   grunt   coffeescript   

原文地址:http://blog.csdn.net/wxqee/article/details/34989361

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!