requireと@importのそれぞれの仕組みの違い

Railsにおいて、CSSファイルが読み込まれている理由は、application.cssファイルに *= require_tree .というコードが、コメントアウトで記述されているからである。
また、SCSSを使用する場合は、ファイルの拡張子をscssに変更して、@ importでscssファイルを読み込んでいる。

この点、requireと@ importのそれぞれの実体と仕組みの違いは何かを解説する。

両者の仕組みの違い

requireとは？

requireは、Railsのアセットパイプラインの仕組みを使ってファイルをインポートするもである。

アセットパイプラインとは、cssファイルやJavaScriptのファイルを１つにまとめ、圧縮することで処理速度を早くするための仕組みをいう。sprocketsというgemがこの機能を担っている。

@ importとは？

@ importは、scssが用意しているメソッドである。そのため、application.scssと拡張子を変更しないと使えない。また、application.scssからscssファイルをインポートするために使用するものでもある。

＜参考記事＞
・https://matatsuna.hatenablog.com/entry/2017/12/03/150520
・http://sakamock.hatenablog.com/entry/2016/02/03/091623