如何使用sails.js连接bower组件？ [英] How do I connect bower components with sails.js?

问题描述

我希望能够通过 bower 安装Javascript依赖项，并在 sails.js中使用它们应用程序，但我无法找到一种方法来做到这一点，只需将粘贴文件从 bower_components 文件夹复制到 Sails 资产文件夹。

I'd like to be able to install Javascript dependencies through bower and use them in a sails.js app, but I can't figure out a way to do this with out just copying an pasting files from the bower_components folder to the Sails assets folder.

理想情况下，我想我想使用 requirejs 并指向 main.js 文件中的bower组件。我可能会试图在一个圆孔中敲一个方形钉，如果有的话请告诉我。欢迎任何关于使用Sails管理组件/库的想法。

Ideally I think I'd like to use requirejs and point to the bower components in the main.js file. I may be trying to pound a square peg in a round hole, please let me know if so. Any thoughts on managing components/libraries with Sails are welcome.

推荐答案

在Sails 0.10中，'assets / linker'目录不再存在，但我找到了简单解决方案的领先优势，为凉亭提供了一些自动化 - >资产链接器工作流程，同时还允许对最终获得链接的内容进行一些精细控制。

In Sails 0.10 the 'assets/linker' directory no longer exists, however I found a lead on simple solution that gives some automation to the bower -> asset linker workflow while also allowing some granular control over what exactly ends up getting linked.

解决方案是在您的Sails.js中添加 grunt-bower strong> compileAssets 任务

The solution is adding grunt-bower to your Sails.js compileAssets task

grunt.registerTask('compileAssets', [
    'clean:dev',
    'bower:dev',
    'jst:dev',
    'less:dev',
    'copy:dev',
    'coffee:dev'
]);

然后像这样配置你的grunt-bower任务（如 tasks / config / bower.js ）：

Then configure your grunt-bower task like so (as tasks/config/bower.js):

module.exports = function(grunt) {
  grunt.config.set('bower', {
    dev: {
        dest: '.tmp/public',
        js_dest: '.tmp/public/js',
        css_dest: '.tmp/public/styles'
    }
  });

  grunt.loadNpmTasks('grunt-bower');

};

这将自动将您的bower js和css文件复制到Sail的资产链接器的适当位置以查找和自动添加到项目的布局模板中。您的凉亭文件后仍会自动添加任何其他js或css文件。

This will automatically copy your bower js and css files to the proper place for Sail's asset linker to find and automatically add to your project's layout template. Any other js or css files will still automatically be added after your bower files.

然而，这仍然没有灵丹妙药，因为这个设置有两大注意事项：

However this is still no silver bullet as this setup has 2 big caveats to it:

1 - 通过bower-grunt添加的文件必须列在bower.json的 main 数组中。如果您看到文件没有被加载，您必须编辑bower.json文件包或通过grunt-bower的 packageSpecific 选项手动添加依赖项。

1 - The files that are added through bower-grunt have to be listed in bower.json's main array. If you see a file isn't being loaded you would expect to be, you must either edit that packages bower.json file OR add the dependency manually through grunt-bower's packageSpecific options.

2 - 资产链接器中的凉亭文件顺序目前按字母顺序排列。到目前为止，我唯一可以调整此顺序的方法就是修补一个额外的grunt任务，在Sail的 compileAssets 任务的其余部分之前手动重新排序文件。然而，我确信有一些grunt-bower可以通过支持包装副本订购来 。

2 - The order of bower files in the asset linker is currently alphabetical. My only recourse to adjust this order so far is tinkering around with an additional grunt task to manually re-order files prior to the rest of Sail's compileAssets task. However this one I'm confident there is something grunt-bower could do by supporting package copy ordering.

这篇关于如何使用sails.js连接bower组件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！