将Javascript库添加到angular-brunch-seed

Question

I clone angular-bunch-seed on my computer https://github.com/scotch/angular-brunch-seed

And I want to add breezejs to my project http://learn.breezejs.com/

I copied the breeze libraries into my vendor folder /vendor/breeze/

And then I changed the config.coffee file as follow:

exports.config =
  # See docs at http://brunch.readthedocs.org/en/latest/config.html.
  conventions:
    ignored: /(^vendor\/.*\.less$)|(^|\/)node_modules\/|(^|\/)_/
    assets: /^app\/assets\//
  modules:
    definition: false
    wrapper: false
  paths:
    public: '_public'
  files:
    javascripts:
      joinTo:
        'js/app.js': /^app/
        'js/vendor.js': /^vendor/
        'test/scenarios.js': /^test(\/|\\)e2e/
      order:
        before: [
          'vendor/console-polyfill/index.js'
          'vendor/jquery/jquery.js'
          'vendor/breeze/breeze.debug.js'
          'vendor/breeze/q.js'
          'vendor/angular/angular.js'
          'vendor/angular-resource/angular-resource.js'
          'vendor/angular-cookies/angular-cookies.js'
          'vendor/angular-sanitize/angular-sanitize.js'
          'vendor/bootstrap/docs/assets/js/bootstrap.js'
        ]

    stylesheets:
      joinTo:
        'css/app.css': /^(app|vendor)/
      order:
        before: [
          'app/styles/app.less'
        ]

    templates:
      joinTo: 
        'js/dontUseMe' : /^app/ # dirty hack for Jade compiling.

  plugins:
    jade:
      pretty: yes # Adds pretty-indentation whitespaces to output (false by default)
    jade_angular:
      modules_folder: 'partials'
      locals: {}

    bower:
      extend:
        "bootstrap" : 'vendor/bootstrap/docs/assets/js/bootstrap.js'
        "angular-mocks": []
        "styles": []
      asserts:
        "img" : /bootstrap(\\|\/)img/
        "font": /font-awesome(\\|\/)font/


  # Enable or disable minifying of result js / css files.
  # minify: true

And when i execute brunch build, check the vendor.js file.. no breeze library included! What am i missing?

PS: When I remove angular.js from the build file, it's properly removed.

Answer 1

Well, the answer has easy and complex subparts.

The easy part: why it does not work. angular-brunch-seed makes use of the bower-brunch package, which internally checks for component.json files in the vendor libraries. That means that if you did not download the library using bower , or place the required component.json at the library's root (and a mention in the root component.json ), it will not be recognized as a proper vendor library and get ignored in the config.coffee 's joinTo regular expression.

The order part of this config.coffee file only manages the order of placement of your libraries in the generated vendor.js file; if that library gets ignored beforehand, the order line has no influence.

Tricky part: get breeze into your vendor libraries. The clean way should be to download it using bower. Thing is, there is as of today no bower package for breeze, as you might have guessed.

[victor@M]<~> bower search breeze
No results
[victor@M]<~> bower search | \grep breeze
No results

That means that you'll have to create it yourself. As explained in the bower docs , you'll have to package the bower final library files (not the sources) and a component.json in a git endpoint (github for instance) under some name (say, bower-breeze ) and register it to bower using bower register . Take a look at what angular guys did , for inspiration. You will also have to include semver tags in that repository to match the versions of the base library. Alternatively, you could open an issue on breeze's github and ask for a component.json to be included in their repository (or better yet, write it and file a pull request).

Last measure, you may try to just write the component.json in your vendor directory and check if it still gets ignored, but I did not test that. Could work (but it's a hack) Maybe you would have to at least add a mention of it in angular-brunch-seed's root component.json too (with version info)

To sum up, angular-brunch-seed is a tricky beast...

Answer 2

I followed your recommendations and sent a pull request to the Breeze team. After the pull request has been accepted, I will had the repo to bower if not done by them already.

for now I created a component.json file into my ./vendor/breeze folder

{
  "name": "breeze",
  "version": "1.2.9",
  "main": "./breeze.debug.js",
  "dependencies": {},
  "gitHead": "0b0891a13d0023bbfdf91785bd99ac5a416bf9c7",
  "_id": "BreezeS@1.2.9",
  "readme": "ERROR: No README.md file found!",
  "description": "ERROR: No README.md file found!",
  "repository": {
    "type": "git",
    "url": "git://github.com/IdeaBlade/Breeze.git"
  }
}

the gitHead is random.. but whatever, when I run brunch build, I can finally see breeze included into vendor.js ! Thx a lot