edm-supergulp/README.md

common build process handling for EMDdesigner repos

# edm-supergulp

This plugins aims to provide a standardized build process to our repos

# Folder Structure

```
project
│   .editorConfig
│   .gitignore
|   .jscsrc
|   .jshintrc
|   gulpfile.js
|   package.json
│   README.md
│
└───src
│   │   components.js
│   │   config-dev.json
│   │   config-staging.json
│   │   config-prod.json
│   │   index.html
│   │   main.js
│   │   main.scss
│   │
│   └───component1
│   |   │   component1.css
│   |   │   template.html
│   |   │   vm.js
│   |   │   core.js
│   │
│   └───component2
│       │   component2.css
│       │   template.html
│       │   vm.js
│       │   core.js
│   
└───examples
|  │   example.html
|  │   main.js
│   
└───spec
│   
└───staticServer
|  │   staticServer.js
│   
└───dist
|  │   edmPluginConfig.js
|  │   index.html
|  │   main.js
|  │   superpreview.css
│   
└───coverage
```

## Default tasks
The supergulp module, given the proper folder structure generates the following
by default (you can also extend the generated files via config)
```
src/index.html        -> ejs        -> dist/index.html  
src/main.js           -> browserify -> dist/main.js  
src/main.scss         -> sass       -> dist/[package.json.name].[min.]css  // This means, that the default name will be tha name provided in the package.json file + ".css", eg. superpreview.css
examples/example.html -> ejs        -> dist/examples/example.html  
examples/main.js      -> browserify -> dist/examples/main.js  
localDeps             -> copy       -> dist/lib/  
```

## Staticserver

The staticServer publishes only the dist folder

# EXAMPLE GULP FILE

```js
var gulp = require("gulp");
var createSuperGulp = require("edm-supergulp");

var superGulp = createSuperGulp({
	gulp: gulp
});

var packageJson = require("./package.json");

var resourceConfigs = {
	dev: __dirname + "/src/config-superpreview-dev.json",
	staging: __dirname + "/src/config-superpreview-staging.json",
	prod: __dirname + "/src/config-superpreview-prod.json"
};

var jsFiles = [
	"./*.js",
	"./src/*.js",
	"./src/**/*.js",
	"./spec/*.js",
	"./spec/**/*.js",
	"./examples/*.js"
];

var jsonFiles = [
	".jshintrc",
	".jscsrc",
	"./package.json",
	"./src/*.json",
	"./src/**/*.json",
	"./spec/*.json",
	"./spec/**/*.json",
	"./examples/*.json"
];

var specFiles = [
	"spec/**/*Spec.js"
];

var sourceFiles = [
	"src/**/*.js"
];

var localDeps = [
	"./node_modules/knob-js/dist/knob.js",
	"./node_modules/knob-js/dist/knob.min.css",
	"./node_modules/normalize.css/normalize.css",
	"./node_modules/knockout/build/output/knockout-latest.debug.js",
];

var deps = [
	"./src/public/img/ipad-white-portrait-final2.png",
	"./src/public/img/iphone5s-white-portrait-final2.png",
	"./src/public/img/macbookpro-final2.png",
	"./src/public/img/macbookpro-final2b.png"
];

var deployFiles = [
	"./dist/*",
	"./dist/**/*",
	"!./dist/examples",
	"!./dist/lib",
];

superGulp.taskTemplates.initPluginTasks({
	packageJson: packageJson,
	resourceConfigs: resourceConfigs,
	deployPath: "preview/" + packageJson.version + "/",
	files: {
		js: jsFiles,
		json: jsonFiles,
		spec: specFiles,
		source: sourceFiles,
		deploy: deployFiles,
		localDeps: localDeps
	},
	tasks: {
		copy: [
			{ files: deps, dest: "./dist/img"}
		],
		ejs: {},
		sass: []
	}
});

```


// USE 'gulp --tasks' TO GENERATE A DEPENDENCY TREE FROM AVAILABLE GULP TASKS!