Using as a build system

Using teacss to create build files in pretty simple. It is convinient to have only one entry point for your styles. And it is already handled in teacss using @import.

Would it be nice to have the same thing for your scripts? For sure.

Some script managers already exist. For example RequireJS and StealJS. AFAIK these are the only two that also handle minification and creating production versions.

As to me they have some flaws.

• They both leave api specific calls inside production file. StealJS has 'pluginify' build type but it is quite buggy.
• RequireJS does not handle CSS.
• StealJS does not support CSS embedding and there is no option for output file name (only production.*)
• StealJS has some path problems in production version and there is no way to reconfigure that.

Some of those problems have their roots in asyncronous web nature. You cannot just write require('module_name') and use it.

The solution is to use some kind of makefile. TeaCSS introduces as new keyword Script.

And @append goes to the scenes. All JS code imported with @append is assumed as needed for production, so it will be bundled into release file.

Example tea "makefile"

// make.tea
Script my_filename {
    // jquery
    @append "scripts/jquery.js";
    @append "scripts/jquery.plugin.js";
    // app
    @append "scripts/app.js";
    @append {
        var x = 5+3; // some plain js
    }
}
// styles
@append "style/jquery.plugin.css";
@impоrt "some_teacss_stylesheet.tea";

Instead of creating lots of script and link tags you can use only one entry point for your application.

<link tea="make.tea">

Later, using build script you can get my_filename.js file that contains jquery.js, jquery.plugin.js and app.js. Minified and compressed.

You can also save styles as described in Intro section