1

静的な JavaScript テンプレートを基本的な Rails アプリにインポートして、それを使用して (特にバックエンドで) Rails 機能をさらに構築できるようにしようとしています。これは、おそらく関連するディレクトリ/ファイルへのウィンドウです...

/アプリ/アセット/スタイルシート/

  • アプリケーション.css
  • base.css
  • blue.css
  • bootstrap-responsive.css
  • bootstrap-responsive.min.css
  • ブートストラップ.css
  • bootstrap.css.erb
  • ブートストラップ.css.scss
  • bootstrap.min.css
  • bootstrap_and_overrides.css.less
  • docs.css.less
  • fontawesome.css.erb
  • glyphicons.css
  • sprites.css.erb

/app/assets/stylesheets/application.css:

/* This is a manifest file that'll be compiled into application.css, 
* which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, 
* lib/assets/stylesheets, vendor/assets/stylesheets,
* or vendor/assets/stylesheets of plugins, if any, can 
* be referenced here using a relative path.
*
* You're free to add application-wide styles to this file 
* and they'll appear at the top of the
* compiled file, but it's generally better to create a 
* new file per style scope.
*
*= require formtastic-bootstrap
*= require_self
*= require_tree .
*/

/アプリ/アセット/フォント:

  • glyphicons readme.txt
  • glyphicons-regular.otf
  • glyphicons-regular.svg
  • glyphicons-regular.ttf
  • glyphicons-regular.woff
  • glyphiconshalflings-regular.eot
  • glyphiconshalflings-regular.otf
  • glyphiconshalflings-regular.svg
  • glyphiconshalflings-regular.ttf

私はどんな助けにも非常に感謝しています、どうもありがとう!

===更新=====

@m_x が提案したように、マニフェスト ファイル (つまり、アプリ内の application.css --> assets --> stylesheets ディレクトリ) を、元のテンプレート (index.html タグ内) でファイルが参照された順序と一致させる必要がありました。新しいバージョンは次のとおりです。

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the top of the
 * compiled file, but it's generally better to create a new file per style scope.
 *  add after glyph <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300' rel='stylesheet' type='text/css'>
 *= require_self
 *= require bootstrap.min.css
 *= require bootstrap-responsive.min.css
 *= require glyphicons.css
 *= require google-fonts.css
 *= require base.css
 *= require blue.css
 */

=======

上記のコードは、テンプレートの index.html ファイルに基づいています。重要な部分は次のとおりです。

<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="css/glyphicons.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300' rel='stylesheet' type='text/css'>
<link href="css/base.css" rel="stylesheet">
<link href="css/blue.css" rel="stylesheet">

URL を参照する方法がわからなかったため、上記の 4 番目の URL にある css を含むファイルを手動で作成したことに注意してください (この css ファイルに「google-fonts.css」という名前を付けました)。

4

1 に答える 1