glava/app.js

## app.js
var ko = require('knockout');

ko.components.register('simple-name', require('./simple-name.js'));

ko.applyBindings({ userName: ko.observable() });

## gulpfile.js
var gulp = require('gulp'),
    browserify = require('browserify'),
    stringify = require('stringify'),
    source = require('vinyl-source-stream');

gulp.task('browserify', function() {
  var bundleMethod = browserify;//global.isWatching ? watchify : browserify;

  var bundler = bundleMethod({
    // Specify the entry point of your app
    entries: ['./app.js']
  });

  var bundle = function() {
    return bundler
      .transform(stringify(['.html']))
      // Enable source maps!
      .bundle({debug: true})
      // Use vinyl-source-stream to make the
      // stream gulp compatible. Specifiy the
      // desired output filename here.
      .pipe(source('app.js'))
      // Specify the output destination
      .pipe(gulp.dest('./build/'));
  };

  return bundle();
});

gulp.task('default', ['browserify']);

## index.html
<!DOCTYPE html>
<html>
  <head></head>
  <body>

    <input data-bind="value: userName"/>

    <!-- using our custom element -->
    <simple-name params="name: userName"></simple-name>

    <script src="knockout.js"></script>
    <script src="build/app.js"></script>
  </body>
</html>

## package.json
{
  "name": "Hello",
  "version": "0.0.0",
  "dependencies": {
    "jquery": "~2.1.3",
    "knockout": "~3.2.0"
  },
  "devDependencies": {
    "gulp": "~3.6.2",
    "browserify": "^4.2.1",
    "vinyl-source-stream": "^0.1.1",
    "stringify": "^2.2.0"
  }
}

## simple-name.html
<p data-bind='text: name'></p>
<button data-bind='click: something'>Click me</button>

## simple-name.js
var template = require('./simple-name.html');

var someFunction = function() {
  console.log('You invoked something() on the viewmodel.');
};

function viewModel(data) {
  this.something = someFunction;
  this.name = data.name;
}


module.exports = {
  viewModel: viewModel,
  template: template
};
	var ko = require('knockout');

	ko.components.register('simple-name', require('./simple-name.js'));

	ko.applyBindings({ userName: ko.observable() });
	var gulp = require('gulp'),
	browserify = require('browserify'),
	stringify = require('stringify'),
	source = require('vinyl-source-stream');

	gulp.task('browserify', function() {
	var bundleMethod = browserify;//global.isWatching ? watchify : browserify;

	var bundler = bundleMethod({
	// Specify the entry point of your app
	entries: ['./app.js']
	});

	var bundle = function() {
	return bundler
	.transform(stringify(['.html']))
	// Enable source maps!
	.bundle({debug: true})
	// Use vinyl-source-stream to make the
	// stream gulp compatible. Specifiy the
	// desired output filename here.
	.pipe(source('app.js'))
	// Specify the output destination
	.pipe(gulp.dest('./build/'));
	};

	return bundle();
	});

	gulp.task('default', ['browserify']);
	<!DOCTYPE html>
	<html>
	<head></head>
	<body>

	<input data-bind="value: userName"/>

	<!-- using our custom element -->
	<simple-name params="name: userName"></simple-name>

	<script src="knockout.js"></script>
	<script src="build/app.js"></script>
	</body>
	</html>
	{
	"name": "Hello",
	"version": "0.0.0",
	"dependencies": {
	"jquery": "~2.1.3",
	"knockout": "~3.2.0"
	},
	"devDependencies": {
	"gulp": "~3.6.2",
	"browserify": "^4.2.1",
	"vinyl-source-stream": "^0.1.1",
	"stringify": "^2.2.0"
	}
	}
	<p data-bind='text: name'></p>
	<button data-bind='click: something'>Click me</button>
	var template = require('./simple-name.html');

	var someFunction = function() {
	console.log('You invoked something() on the viewmodel.');
	};

	function viewModel(data) {
	this.something = someFunction;
	this.name = data.name;
	}


	module.exports = {
	viewModel: viewModel,
	template: template
	};