malte-wessel

If you are using backbone (and backbone.marionette) in a browserify managed project, you will likely run into issues with underscore (at least if you manage your dependencies with npm). Each package, that has underscore as a dependency, will require its own version of underscore (making your bundle file contain multiple versions of underscore). Back in the days, you could shim backbone and underscore like:

browserify({
	shim: {
		'underscore': {
			path: './node_modules/underscore/underscore.js',
			exports: '_'
 },

malte-wessel

var h = require('virtual-dom/h');
var diff = require('virtual-dom/diff');
var patch = require('virtual-dom/patch');
var createElement = require('virtual-dom/create-element');
var Backbone = require('backbone');
var $ = require('jquery');
Backbone.$ = $;

var BaseView = Backbone.View.extend({
  

malte-wessel

var Backbone = require('backbone');
var $ = require('jquery');
Backbone.$ = $;

var view = new Backbone.View();
var model = new Backbone.Model();

view.listenToOnce(model, 'foo', function(){ console.log('foo!'); });
model.trigger('foo');

malte-wessel

var _ = require('lodash'),
	Promise = require('bluebird');

// No, this is not nice, but there's no other way to get the helpers
var Helpers = require('node_modules/bookshelf/lib/helpers');

var database = require('app/core/database');

var Collection = database.Collection.extend({

malte-wessel

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _raf2 = require('raf');

malte-wessel

import { createComponent } from 'melody-component';
import template from './template.twig';

export default createComponent({
  componentDidMount() {
    this.refs.button.addEventListener('click', this.handleClick);
  },
  componentWillUnmount() {
    this.refs.button.removeEventListener('click', this.handleClick);
  }

malte-wessel

import { createClass } from 'react';

const receiveProps = props => ({
  type: 'RECEIVE_PROPS',
  payload: props
}};

export default function createComponent(template, reducer) {
  const { template, componentWillReceiveProps, ...rest } = definition;
  if (!template) throw new Error('Please provide a template.');

malte-wessel

var React = require('react');
var ReactDOMServer = require('react-dom/server');

function App() {
  return React.createElement("div", null,
    "Hallo ",
    name,
    ", Wie gehts?"
  );
}

malte-wessel

import { createComponent } from 'melody-component';
import template from './Box.twig';
export default createComponent(template);

malte-wessel

function doWhile(test) {
    return function*(task, ...args) {
        let result;
        do {
            result = yield call(task, ...args);
        } while(yield test(result))
    };
}

function retryable(maxRetries = 0) {