Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add prepend option to BrowserifyAsset and update readme #109

Closed

Conversation

bryanchriswhite
Copy link

Synopsis:

Adds an optional prepend option to BrowserifyAsset. This will allow the Browserify asset to include another javascript asset at the beginning of the file it generates.

Use Case:

A specific use case is discussed in issue #82 and in conjunction with PR #107 should allow for a single asset to serve a bundle of all of a client apps JS files and it's templates via a single script tag.

Example:

The example project described below can be found here

Project directory structure:

AssetRackExample
├── app.js
├── assets.js
├── public
│   ├── index.html
└── widget
    ├── app
    │   ├── controllers
    │   │   └── index.js
    │   ├── directives
    │   ├── index.js
    │   └── views
    │       ├── view1.html
    │       └── view2.html
    └── test
        ├── e2e
        └── spec

Server

In assets.js (/assets.js):

var rack = require('asset-rack')
  , assets = new rack.Rack([
    new rack.BrowserifyAsset({
      url     : '/js/widget.bundle.js',
      filename: __dirname + '/widget/app/index.js',
      prepend : new rack.AngularTemplatesAsset({
        url    : '/js/widget/templates.js',
        dirname: __dirname + '/widget/app/views'
      })
    })
  ])
  ;

module.exports = assets;

In app.js (/app.js):

var assets = require('./assets');
app.use(assets);

Client

In index.html (public/index.html):

<script src='/js/widget.bundle.js' type="text/javascript"></script>

In index.js (widget/app/index.js):

angular.module('myApp', [])
  .config([
    '$routeProvider', function($routeProvider) {
      $routeProvider
        .when('/one', {
          templateUrl: 'view1.html',
          controller : 'MainCtrl'
        })
        .when('/two', {
          templateUrl: 'view2.html',
          controller : 'MainCtrl'
        })
    }
  ])
  .run(['$templateCache', angularTemplates]);
require('./controllers');

Should wrap up issue #82

@bryanchriswhite
Copy link
Author

My use case for the prepend option is to be able to prepend multiple AngularTemplateAssets (i.e. widget templates and shared templates). This specific use case is dependant on #110. JadeAsset already supports the clientVariable option so prepending multiple JadeAssets would be another valid use case which is resolved by this PR.

@bryanchriswhite
Copy link
Author

included in #80

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant