こんにちは、Masayukiです。
「Shopifyでオリジナルのサイトを作りたい!」
「Shopifyで独自のCSSファイルを使いたい!」
という人は必ず通る道である、Sassの使う方法について紹介します。
タイトルにもある通り2つの方法を紹介します。
コンパイルをする方法(Visual Studio Code 使用)
私自身Visual Studio Codeを使っているため、その説明となります。
まず、下記サイトを参考にVSコードにLive Sass Compilerを入れます。
続いて、Shopifyのassetsフォルダ内に「filename.scss」ファイルを作成します。
その後、上記サイトを参考に.scssのファイルをコンパイルすると、assetsフォルダ内に「filename.css」が作成されます。
その後、shopifyのlayoutフォルダ内の<head>内に
{{ 'filename.css' | asset_url | stylesheet_tag }}
を入れます。(できれば、</head>の上辺りが良いです)
そうすると、表示されると思います。
ここでうまく表示されない人もいると思います(私自身そうでした)
その方はshopifyの管理画面に移動してください。

「オンラインストア→テーマ→コードの編集」で上記画像の画面に移動したら、「Assets」フォルダの中に「filename.css」があるか確認します。
もしなかった場合は「新しいassetを追加する」から「filename.css」を追加してください。
そのファイルに先程コンパイルによって生成された、「filname.css」のコードを貼り付けることで表示されます。
コンパイルをしない方法(簡単)
assetsフォルダの中に「filname.scss.liquid」のファイルを作成します。
そのファイルにSassを書き込むだけです。
その後、layoutフォルダの「theme.css」に
{{ 'filename.scss.css' | asset_url | stylesheet_tag }}
を書き込むことで表示されます。
以上の方法でSassを使ってみてください!