Giter Site home page Giter Site logo

coffee-middle's Introduction

#Coffee-middle

A Connect / Express middleware node.js application for compiling coffee-script files to a new file or on the fly.

##Installation

npm install coffee-middle

##Usage

app.configure "development", ->
	app.use(require("coffee-middle")({
        src: __dirname + "/precompiled/js"
        dest: __dirname + "/static/js"
    }))

    app.use(express.static(__dirname + '/static'))
    app.use(this.router)

or Javascript (works in both)

app.configure("development", function(){
	app.use(require("coffee-middle")({
        src: __dirname + "/precompiled/js",
        dest: __dirname + "/static/js"
    }));

    app.use(express.static(__dirname + '/static'));
    app.use(this.router);
});

##Automatic Browser Reload

This is an experimental feature utilizing socket.io while using Jade templates. It will automatically reload your browser (currently working with chrome) on changes and update the latest coffee file.)

In order to utilize this workflow feature:

  • Set the browserReload parameter to true
  • Add the helper global method to your Jade Template (currently only works in jade)
  • Make sure that you ignore the directory containing your client CoffeeScript files if you are using a service like supervisor

Usage (express.js configuration)

#Recommended only for development mode!!!
app.configure "development", ->
	app.use(require("coffee-middle")({
        src: __dirname + "/precompiled/js",
        dest: __dirname + "/static/js",
        browserReload: true
    }));

Usage (Jade Template File) (just include the global function mentioned below)

!!!
html
	head
		title= title
		!= coffee()

##Parameters

  • src (folder_dir) : The folder directory where the .coffee files reside
    (required)

  • dest (folder_dir) : The folder directory where the .js files will reside
    (required ONLY if you want to write the compiled coffee to a file)

  • bare (bool) : A coffee compilation option to contain a function wrapper around the code within the file. False means it will have the wrapper function, true means it will not.
    (defaults to true)

  • jadeFunction (string) : The name of the Jade global helper function (described below)
    (defaults to coffee)

  • publicDir (folder_dir) : The name of the public directory that your script tags are referencing
    (defaults to /js)

  • writeFileToPublicDir (bool) : Write the compiled javascript file to the dest folder. If you make it false, all compilation will be done on the fly. If you do have file writing turned on, it will compile the file only if the coffee file is newer than the js file.
    (defaults to true)

  • minify (bool) : Minify the written outputted JS file using uglify-js
    (defaults to true)

  • browserReload (bool) : Tells the application to listen for changes to your coffee files and automatically reload your browser.
    (defaults to false) …this is an experimental feature and recommended only for development mode and not for production

  • broserReloadPort (number) : The port for the socket.io instance to listen on if `browserReload is set to TRUE
    (defaults to 11911)

##Jade Helper

You have a choice of explicitely telling Jade the coffee files (as javascript files), OR you can use the Jade Helper Function.

The Helper Function will look in the src folder you specified in the parameters and automatically tell Jade to ask for all the files in that directory. This is especially helpful if you do not care about the order the files are created in.

The helper can have an optional passed in argument with one of the following values:

  • files (default if browserReload param is set to FALSE) : only output the source of the files
  • reload : add in the Javascript so that automatic browserReload will work
  • both (default if browserReload param is set to TRUE) : Do both operations above

###Manual

(This is the normal jade way)

!!!
html
    head
        title= title
        script(src='/js/orders.js')
        script(src='/js/products.js')
      	script(src='/js/customers.js')

###Helper Function

(This is using the helper function created from coffee-middle)

!!!
html
	head
		title= title
		!= coffee()

(optional argument passed in)

!!!
html
	head
		title= title
		!= coffee("both")

If orders.coffee, products.coffee, and customers.coffee are in the src folder you specified, both of these implementations would output to html in the exact same way.

##The Future ...as you can see from the version number (0.0.2), I am just starting with this. There are quite a bit of things I want to accomplish and will mark them shortly in the wiki.

coffee-middle's People

Contributors

djwglpuppy avatar

Stargazers

Gaston Morixe avatar node-migrator-bot avatar Nando Rossi avatar  avatar Honza Pokorný avatar Robert Wallis avatar

Watchers

 avatar James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.