railsでアプリを作成中、Undefinedとエラーが起きた時の対処した方法

今回、mixinを使用しようとして、Undefinedとなりmixinのファイルが読み込まれない問題が起きた！結論は、下にあります。右のサイドバーのとこから下のに飛んでください。

mixinの使い方として、以下の方法がある。

@mixin box{
  height: 50px;
  width: 50px;
}

.box1{
  @include box;
  background-color: red;
}

@mixin box($length){
  height: $length;
  width: $length;
}

.box1{
  @include box(50px);
  background-color: red;
}

@mixin box($height, $width){
  height: $height;
  width: $width;
}

.box1{
  @include box(50px, 100px);
  background-color: red;
}

以上の方法がある。

要は、
@mixinで、箱を定義してあげ、そのまま使う方法 と 箱の形を定義してあげ、使用するときに値を入れてあげる方法

・しかし、今回記述方法にミスは、見られないはずなのにmixinのファイルが読み込まれないエラーとなった

この、原因はapplication.scssファイルに**@import**する順番の問題であった。

ファイルの上から、順に読み込まれていくために**@mixinを定義したファイルを使用するファイルの下に記述していたため、@mixin**がまだ定義されていないからわからないという意味であることがわかった。

したがって、まずmixinを定義したファイルを読み込ませる。

よって、@importする順番を間違えていたことに気づいた。

これは、初心者でまだ慣れていないために起きた。

以上で終わり
間違っていることがあれば、すみません。