Skip to content

Instantly share code, notes, and snippets.

@dunglas dunglas/index.html.twig
Last active Dec 10, 2015

What would you like to do?
Chaplin.js boilerplate for Symfony (Twig)
Part of the Dunglas' Symfony 2 / Chaplin.js tutorial
<!DOCTYPE html>
<meta charset="utf-8">
<title>Chaplin Boilerplate Application</title>
body { font-family: sans-serif; }
<h1>Chaplin Boilerplate Application</h1>
<p>This Chaplin example provides an app scaffold using RequireJS as module loader. Handlebars is used as templating engine. The templates are loaded on demand using the RequireJS text plugin.</p>
<div id="page-container"></div>
{% javascripts '@DunglasChaplinDemoBundle/Resources/public/js/vendor/require-2.1.1.js' %}
<script src="{{ asset_url }}"></script>
{% endjavascripts %}
// Configure the AMD module loader
// The path where your JavaScripts are located
baseUrl: '{{ asset('bundles/dunglaschaplindemo/js/') }}',
// Specify the paths of vendor libraries
paths: {
jquery: 'vendor/jquery-1.8.2',
underscore: 'vendor/underscore-1.4.2',
backbone: 'vendor/backbone-0.9.2',
handlebars: 'vendor/handlebars-1.0.rc.1',
text: 'vendor/require-text-2.0.3',
chaplin: 'vendor/chaplin-1.0.0-pre-59cac06'
// Underscore and Backbone are not AMD-capable per default,
// so we need to use the AMD wrapping of RequireJS
shim: {
underscore: {
exports: '_'
backbone: {
deps: ['underscore', 'jquery'],
exports: 'Backbone'
handlebars: {
exports: 'Handlebars'
// For easier development, disable browser caching
// Of course, this should be removed in a production environment
{% if app.environment == 'dev' %}, urlArgs: 'bust=' + (new Date()).getTime(){% endif %}
// Bootstrap the application
require(['hello_world_application'], function (HelloWorldApplication) {
var app = new HelloWorldApplication('{{ path('dunglas_chaplindemo_default_index') }}');
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.