scalify

Browserify for the big scale!

Usage no npm install needed!

<script type="module">
  import scalify from 'https://cdn.skypack.dev/scalify';
</script>

README

Scalify.js

Browserify for the big scale!

Scalify allows you to browserify and watchify multiple sources and direct them to multiple different destinations. Useful for large-scale applications that require separate bundles for separate parts fo the application. Handles transforms too :)

Browserify is a fantastic tool that makes writing modular javascript code so much easier. However, it's utility isn't as simple when we need more than a Single Page Application. Constantly having to provide command line arguments to run browserify/watchify every time can get cumbersome. This module removes the clutter from command line and moves everything to file configuration. All you need to provide is a simple set of commands - watch, bundle, clean. Scalify does the rest!

Getting Started

Install the module globally:

npm install -g scalify  

Usage

Usage: scalify [command] [ALIASES...]  
  
Commands:  
  clean  [ALIASES...]  
    clean all bundles in each bundledir. Takes optional list of aliases  
  
    $ scalify clean alias1 alias2  
  
  bundle [ALIASES...]  
    run browserify on all sources. Takes optional list of aliases  
  
    $ scalify bundle alias1 alias2  
  
  watch  [ALIASES...]  
    run watchify on all sources. Takse optional list of aliases   
  
    $ scalify watch alias1 alias2  
Options:  
  -h, --help		   output usage information  
  -V, --version		output the version number  
  
```	 
  
Scalify takes all of its configuration from the package.json on the **"scalify"** property. This can be an **object** or **string** pointing to a json file with the configuration. Here's what your **"scalify"** might look like.  
  
  
### Example
####package.json
```json 
"name": "my_project",
"description": "...",
"main": "...",
"scalify": {  
  "sourcedir": "./path/to/sourcedir/",  
  "bundledir": "./path/to/bundledir",  
  "manifests": [  
    {  
      "alias": "js_app",  
      "sources": "app.js",  
      "bundle": "app_bundle"  
    },  
    {  
      "opts": {  
        "debug": true  
      },  
      "alias": "coffee_app",  
      "sources": ["one.coffee", "two.coffee"],  
      "bundle": "coffee_app_bundle.js",  
      "transforms": [  
        { "coffeeify": {} }  
      ],  
      "sourcedir": "./path/to/sourcedir",  
      "bundledir": "./path/to/bundledir"  
    }  
  ]  
},
"dependencies": {
  "coffeeify": "*"
}

As we can see above we have both global and local options. The "sourcedir" and "bundledir" keys outside of the manifests array will apply to all of the manifests. However, "coffee_app" has it's own "sourcedir" and "bundledir", which will override the global config. Either will work, but they are required keys (so make sure you have one of those configs set). Here's a breakdown of the properties: both global and local.

Global

Set properties for all manifests to use. These properties are overriden by any manifest that has it's own corresponding key.

Parameters

sourcedir
Type: String

The location of the source directory for all of the sources. Required Globally or on Local Manifest.

bundledir
Type: String

The location of the bundle directory for all of the bundles. Required Globally or on Local Manifest.

transforms
Type: Array

Run transforms for all manifests. Indicate as array of objects, where the key is the transform name and the value would be any arguments/options you want passed. Optional

"transforms": [
{ "coffeeify": { "global": true, "foo": 123 } }
]


**opts**  
Type: `Object`  
> Takes browserify options you want executed on all manifests, with the exception of **'basedir'** and **'entries'**. **Optional**
>  ```json  
  "opts" {  
    "debug": true  
  }  

see browserify options

Local (manifest in "manifests" array)

Set properties for a manifest inside the "manifests" property. Any properties set here will override the global properties (see above).

Parameters

sourcedir
Type: String

The location of the source directory for the manifest source(s). Required Globally or on Local Manifest.

bundledir
Type: String

The location of the bundle directory for the bundle. Required Globally or on Local Manifest.

opts
Type: Object

The browserify options you want set on this particular manifest, with the exception of 'basedir' and 'entries'. Optional

"opts" {
"debug": true
}


> see [browserify options](https://github.com/substack/node-browserify#var-b--browserifyfiles-or-opts)

**alias**  
Type: `String`
> The alias for this particular manifest. Must be **UNIQUE**. **Required** on local manifest

**sources**  
Type: `String`/`Array`
> The source(s) (inside the sourcedir) that you want executed as the entry point(s). Must include file extension. **Required** on local manifest

**bundle**  
Type: `String`
> The bundle file name you want (will end up in the bundledir). **Required** on local manifest 

**transforms**  
Type: `Array`  
> Run transform(s) on the manifest. Indicated as an array of objects where the key is the transform name and value would be any arguments/options you want passed. **Optional**
> ```json  
"transforms": [  
  {  "coffeeify": {  "global": true,  "foo": 123  }  }  
]  

Path Resolution

The paths for sourcedir and bundledir are relative to where-ever you call $ scalify -i.e. the pwd.

About Transforms

Transforms are supported in almost the same way as browserify handles transforms. The difference here being that instead of providing an array of strings, you're providing an array of objects where the 1st key is the transform name (string), and 2nd key is whatever options for the indicated the transform you desire (object). I have rarely ever seen anyone pass options to the transform (via CLI) but seeing as browserify supports it, so does scalify. Obviously, in order to use a transform you need to have it installed as a dependency in your package.json (just like you would with browserify). Aside from the declaration syntax, the transforms act exactly as you would if you were using browserify directly - i.e. at the top level of your package.json with whatever configuration you required.

package.json

"name": "...", "description": "...", "scalify": { "..." }, "browserify-shim": { "..." } "dependencies": { "browserify-shim": "*" }


Why Scalify?
---
Honestly, I wanted to use browserify with a monolith Ruby on Rails application. I wanted to incorporate browserify (and watchify) without intruding too much into the app itself. With a simple package.json configuration, using browserify in multiple places throughout the application (whichever framework you're using) becomes incredibly simple. 

TODO
---
1. Tests
2. Plugin support

Contribute
---
Issues and pull requests welcome :) 

1. Fork it
2. Create your feature branch (`git checkout -b feature/my-new-feature`)
3. Commit your changes (`git commit -am 'Add some feature'`)
4. Push to the branch (`git push origin feature/my-new-feature`)
5. Create a new Pull Request