webcompounder v1.1.6

You can install webCompounder from npm, like any other npm package.

> npm install webcompounder --save-dev

You should probably install it as a developer dependency, using the --save-dev flag. (Unless you have a reason not to, of course.)

Unlike some npm packages, webCompounder does not need to be installed globally to work. (It will only work within the folder it's installed into, though. But in most cases thats all you need.)

webCompounder doesn't use a lot of flags or command line arguements, instead you set the options in a configuration file.

If you have different workflows with different options, you can have multiple configuration files, and can run configuration file one at a time.

Then you put the path to the configuration file as an arguement in the command.

> webCompounder ./pathTo/configFile.json

Configuration files are JSON files with a workflow value, an input value, and an output value.

The configuration file can have any filename and can be in any folder, but must be a json file and can not be outside of the root folder.

Here's an example:

{
  "workflow": "bundle",
  "input": [
    "./pathTo/file.extension",
    "./pathTo/aFolder/",
    "./globsAre/**/alsoSupported/*.cool"
    "./yetAnother.extension"
  ],
  "output": "./pathToOutputFile/outputFile.extension"
}

Here's another, more real-world example:

{
  "workflow": "bundle",
  "input": ["./src/utils/colors.js", "./src/utils/utils.js", "./src/main.js"],
  "output": "./build/main.build.js"
}

The input value is an array, and each string in the array is a file path to the files you want to merge together.

The output value is a single string, and is a file path pointing to the file that all the other files will combine into.

All the file paths are relative to the root folder, where package.json is and where your terminal/shell session is, even if the configuration file is not in the root folder, paths are still relative to the root folder!

Installation: ./

> npm install webcompounder --save-dev

Input File: ./src/utils/colors.js

This file's code does not matter, its just an example of a file that will be combined.

var colors = {
  red: "#ff0000",
  orange: "#ff5500",
  yellow: "#ffff00",
  green: "#00ff00",
  blue: "#0000ff",
  purple: "#ff00ff",
  white: "#ffffff",
  gray: "#555555",
  black: "#000000",
};

Input File: ./src/utils/utils.js

This file's code does not matter, its just an example of a file that will be combined.

var utils = {
  colors: colors,
};

Input File: ./src/main.js

This file's code does not matter, its just an example of a file that will be combined.

var someLibrary = {
  utils: utils,
};

Configuration File: ./build/config/buildJs.json

{
  "workflow": "bundle",
  "input": ["./src/utils/colors.js", "./src/utils/utils.js", "./src/main.js"],
  "output": "./build/main.build.js"
}

Notice how even though the configuration file is in ./build/config/, the paths are relative to ./. This is because ./ is where webCompounder was installed into.

Terminal/Shell: ./

> webCompounder --v
v1.1.6
> webCompounder ./build/config/buildJs.json
Sucessfully loaded config file!

Sucessfully bundled files!
Process Complete!

You can run webCompounder --v or webCompounder --version to check the version of webCompounder that's installed. This also helps test if webCompounder is working.

Output File: ./build/main.build.js

This file's code does not matter, its just an example of a file that was generated.

var colors = {
  red: "#ff0000",
  orange: "#ff5500",
  yellow: "#ffff00",
  green: "#00ff00",
  blue: "#0000ff",
  purple: "#ff00ff",
  white: "#ffffff",
  gray: "#555555",
  black: "#000000",
};

var utils = {
  colors: colors,
};

var someLibrary = {
  utils: utils,
};