0

非常に基本的なRubyonRailsのインストールがあります。bootstrap-sassgemをインストール'bootstrap-sass' ~> 2.3.1.0し、Gemfileにを入れて、を実行しましbundle installた。すべてのアプリケーションを再起動しました。style.css.scssアプリ>アセット>スタイルシートにファイルがあり、@imports 'bootstrap';レスポンシブです。これらのスタイルは、フロントエンドのスタイルを設定するため、実際に私のアプリに組み込まれます。ただし、変数またはミックスインを使用しようとすると、添付された画像にエラーが表示され、IntelliJから変数が見つからないというエラーが表示されます。私はこのプロセス全体に慣れていないので、それを解決するために何が必要かを理解しようとしています。

Ruby2.0.0とRails3.2.13rc2を使用しています

https://docs.google.com/file/d/0BwMz3RH42HtQb0U1TXdHTVF0QjQ/edit?usp=sharing

@import "bootstrap";

body {
  padding-top: 60px;
}

@import 'bootstrap-responsive';

.footer {
  margin-top: 50px;
  color: $greyLight;

    a {
      color: #e5e5e5;
    }
}

変数を使用せずに、herukoのライブ開発サイトへのリンクを次に示します。

http://shrouded-ocean-4277.herokuapp.com/

編集：私のvendor / Assets / stylesheetsフォルダーには、ブートストラップフォルダーまたは_mixinsまたは_variablesファイルはありません。gemをGemfileに配置し、バンドルをインストールしたときに、これらをインストールする必要がありますか？

編集：私のgithubを追加する：https ：//github.com/ChrisSki/omrails

4

2 に答える 2

1

編集に関しては、bootstrapはvendorではなく、Ruby インストール内のどこかにある .gem ファイルにあります。

このガイドに従って、最近同様のアプリケーションをセットアップしました。私は 2 つ.css.scssのファイルを持っています。1 つは bootstrap の一部を含めてオーバーライドし、もう 1 つはアプリケーションのスタイル(Bootstrap とは直接関係ありません) を含みます。2 番目のファイルを見るとbootstrap/variables、Bootstrap の変数の一部にアクセスする必要があったためにインポートしたことがわかります。これは魅力的に機能します。

私が理解できないのは、元のスクリーンショットが という名前variablesの何かについて不平を言っている理由です。これは、SCSS ファイルには表示されません...bootstrap/variables代わりに試しましたか?

編集：

私はあなたのレポを複製し、サーバーを起動してハッキングしstyle.css.scssました。テストでタイプミスをしたと思います:)

h1 {
    color: $greyLight; /* Does not work!! */
    color: $grayLight; /* Works :) */
}
于 2013-03-21T09:03:54.523 に答える
0

ブートストラップをインポートする前に変数を宣言する必要があります。そうすれば、scssで変数を使用できます。たとえば、Railsアプリで変数を使用する方法は次のとおりです。

/************************ CSS Variables ***************************/
$myColor: #0F851C;    

/************************ Import Bootstrap ********************************/
@import 'bootstrap';
body { padding-top: 80px; }
@import 'bootstrap-responsive';

scssの上部で変数を定義してから、ブートストラップをインポートするだけです。次に、scssで、次のような変数を使用できます。

#myDiv {
  color: $myColor;
}

お役に立てれば！

于 2013-03-21T01:49:01.603 に答える