添加一个javascript库到angular-brunch-seed

Add a javascript library to angular-brunch-seed

本文关键字:javascript 库到 angular-brunch-seed 一个 添加      更新时间:2023-09-26

我在我的电脑上克隆了角束种子https://github.com/scotch/angular-brunch-seed

我想把breezejs添加到我的项目中http://learn.breezejs.com/

我将breeze库复制到我的vendor文件夹/vendor/breeze/

然后我改变了配置。咖啡文件如下:

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

当我执行早午餐构建时,检查vendor.js文件。不包括微风库!我错过了什么?

PS:当我从构建文件中删除angular.js时,它被正确地删除了

答案有简单和复杂的子部分。

简单的部分:为什么它不起作用。Angular-brunch-seed使用了bower-brunch包,它会在内部检查组件。供应商库中的Json 文件。这意味着如果您没有使用下载库,或者放置所需的组件。Json 在库的根目录(并在根目录component.json中提到),它将不会被识别为一个合适的供应商库,并在配置中被忽略。coffee's joinTo正则表达式。

配置的order部分。Coffee 文件只管理生成的vendor.js文件中库的位置顺序;如果事先忽略了该库,则订单行没有影响。

棘手的部分:让微风进入你的供应商库。最干净的方法应该是使用bower下载它。问题是,今天没有凉亭包微风,你可能已经猜到了。

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

这意味着你必须自己创建它。正如在下面的文档中所解释的,您必须打包最后的库文件(不是源文件)和一个组件。在git端点(例如github)中以某个名称(例如bower-breeze)保存,并使用bower register将其注册到bower。看看那些棱角分明的家伙是怎么做的吧,寻找灵感。您还必须在该存储库中包含semver标记,以匹配基本库的版本。或者,你可以在breeze的github上打开一个issue,并请求一个组件。Json 包含在他们的存储库中(或者更好的是,编写它并提交拉取请求)。

最后,您可以尝试只编写组件。json在你的供应商目录,并检查它是否仍然被忽略,但我没有测试。也许你至少要在angular-brunch-seed的根组件中添加一个提及。Json too(带版本信息)

总而言之,角早午餐种子是一个棘手的野兽…

我遵循了您的建议,并向Breeze团队发送了一个pull请求。在pull请求被接受后,如果他们还没有完成,我将有一个repo来展示。

现在我创建了一个组件。Json文件到我的。/vendor/breeze文件夹

{
  "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"
  }
}

gihead是随机的。但无论如何,当我运行早午餐构建时,我终于可以看到微风包含在vendor.js中!非常感谢