代码之家  ›  专栏  ›  技术社区  ›  Alon

无法将bower组件css添加到Rails 4.2中的资产管道中

  •  3
  • Alon  · 技术社区  · 10 年前

    我正在尝试将bower组件(angular ui网格)添加到angularJS+Rails 4.2应用程序中。
    该组件在开发环境中运行良好,但在生产环境中,它在没有css的情况下运行良好。

    我已经通过一个bower将组件安装到 供应商/资产/bower_components 并进行了以下更改,以便将其整合到资产管道中:

    应用程序.css.scss

    @import "angular-ui-grid/ui-grid.css";
    

    应用程序.js

    //= require angular-ui-grid/ui-grid.min.js
    //= require_tree .
    

    应用程序.rb

    config.assets.paths << Rails.root.join('vendor', 'assets', 'bower_components')
    

    资产.rb

    Rails.application.config.assets.precompile << %r(.*.(?:eot|svg|ttf|woff)$)
    Rails.application.config.assets.precompile += %w( ui-grid.css )
    

    我执行了 rake资源:预编译 其产生以下输出:

    Writing /source/myapp/public/assets/application-546acf8e965ef660d80be61d1314dcef.js
    Writing /source/myapp/public/assets/application-bf4c9902bcb508f0250e847dc63c3321.css
    Writing /source/myapp/public/assets/angular-ui-grid/ui-grid-70f73890ff81d1e19e758473a9ff1f1e.eot
    Writing /source/myapp/public/assets/angular-ui-grid/ui-grid-069439f9e57a19c07fad6095a9056446.svg
    Writing /source/myapp/public/assets/angular-ui-grid/ui-grid-f681537c8135d9deb670ceadfb8eddd4.ttf
    Writing /source/myapp/public/assets/angular-ui-grid/ui-grid-a3319d6298bca8dd2bcaae48735afe00.woff
    Writing /source/myapp/public/assets/bootstrap-sass-official/assets/fonts/bootstrap/glyphicons-halflings-regular-e4c812e8c30abb98e787ab176cb74129.eot
    Writing /source/myapp/public/assets/bootstrap-sass-official/assets/fonts/bootstrap/glyphicons-halflings-regular-c9450138a7b29547267148145ba65c3e.svg
    Writing /source/myapp/public/assets/bootstrap-sass-official/assets/fonts/bootstrap/glyphicons-halflings-regular-7ef334f0e220af09b5aa3a8283ccaa6a.ttf
    Writing /source/myapp/public/assets/bootstrap-sass-official/assets/fonts/bootstrap/glyphicons-halflings-regular-97811df08b2f65e376ad5b37fc5f315b.woff
    

    出于某种原因/预编译输出中缺少assets/aangular ui grid/ui-grid.css!

    当我在productionenv中运行我的Rails应用程序时(在开发中它运行得很好),ui网格组件正在运行(=>ui网格javascript已成功集成到资产管道中),但没有它的css(所有的ui-grid.css类),看起来很糟糕。

    如何将ui-grid.css添加到资产管道中?

    1 回复  |  直到 10 年前
        1
  •  2
  •   Eyal Kedem    10 年前

    我遇到了同样的问题。除了执行sass导入外,还需要执行链轮导入。

    添加

    *= require angular-ui-grid/ui-grid.css

    到清单上,你应该没事。