同じことで躓いたときのための備忘録です.
深い内容は存じ上げないのでご容赦ください.
補助ライブラリの
SDL2_mixer(音声関連)
SDL2_image(画像関連, SDL単体だけではBMPファイルしか扱えません)
SDL2_ttf(テキスト出力関連, tureTypeFontを扱えます)
の導入も併せて紹介いたします.

CLionとは

IDE(統合開発環境)の開発を主に行っているJetBrains社のC++向けIDEです. MacとWindows両方で使えるため, 両方使う人にはとても便利です.
詳しい導入方法などは他の記事をご覧ください.

SDLとは

Simple DirectMedia Layerの略でマルチプラットフォームで利用できるマルチメディアライブラリで, c系以外の主要言語にも移植がされています. 現在(2019/2/23)主に2系と1.2系に分かれます. 本記事では2系を導入することを前提にしています.
非常に軽量で導入しやすい反面, 非常に限られたことしかできません.

環境導入

用意するもの(詳細, リンクは各項目で説明します)

最新版のSDL2のインストーラ(執筆時2.0.9)
各種補助ライブラリのインストーラ
find_packageするためのcmake file
FreeType2(SDL_ttfの導入に必要, 導入済みなら不要)
再生したい音声ファイル(wavファイルのみ動作確認済み)
表示したい画像ファイル(pngファイルのみ動作確認済み)
画面表示したい文字のttfファイル(例IPAフォント)

SDL2の導入

以下X.Y.Zは導入したいバージョンで読み替えてください.
1.ダウンロードページからSDL2-X.Y.Z.zip及びSDL2-X.Y.Z.dmgをダウンロードします.
2. SDL2-X.Y.Z.zipを展開し, ターミナルで展開したディレクトリに移動します.
3. ターミナル上で ./configureと入力.
このとき, 必要なライブラリがないとき

configure: error: *** Unable to find ~~~ library (http:~~~)

のように表示されて終了します. 適宜必要なものを導入して再度./configureを入力してください.
4. ターミナル上で makeと入力. 正常終了するまで待つ.
5. ターミナル上で make installと入力. 環境によっては先頭にsudoが必要で, パスワードの入力を求められます.
6. SDL2-X.Y.Z.dmgファイルを開き中のSDL2.Frameworkを/ライブラリ(もしくはLibrary)/Frameworksにコピーします. ディレクトリがない場合は作成してください.

各種補助ライブラリの導入

SDL2のバージョンと各種補助ライブラリのバージョンの数字は異なります. それぞれの安定版もしくは最新版を導入してください. 導入方法はほぼSDL2と同じです.

ダウンロードページから
- SDL2_mixer-X.Y.Z.zip(執筆時2019/2/23, 最新版2.0.4)
- SDL2_mixer-X.Y.Z.dmg
- SDL2_image-X.Y.Z.zip(執筆時2019/2/23, 最新版2.0.4)
- SDL2_image-X.Y.Z.dmg
- SDL2_ttf-X.Y.Z.zip(執筆時2019/2/23, 最新版2.0.15)
- SDL2_ttf-X.Y.Z.dmg

をそれぞれダウンロードする
2. それぞれのdmgファイルを展開し, ターミナルでそれぞれのディテクトリに移動します.
3. それぞれのディレクトリで先ほどと同様./configure, make, make installを順番に入力します. この際多くの場合./configureののちに

configure: error: *** Unable to find FreeType2 library (http://www.freetype.org/)

と表示されます. この場合, 次の項目でFreeType2をインストールしたのち, ./configureからやり直してください.
4. それぞれのdmgファイルを開き, ~.Frameworkを先ほどのを/ライブラリ(もしくはLibrary)/Frameworksに入れる.

FreeType2の導入(必要な場合)

前項目でFreeType2が導入されていなくて怒られた場合に必要です.

ダウンロードページからfreetype-X.Y.tar.gzもしくはfreetype-X.Y.Z.tar.gzををダウンロードします(執筆時2019/2/23, 最新版2.9.1).
展開してターミナル上でそのディレクトリに移動.
先ほどと同様, ./configure, make, make installを順番に入力します.

Clionでの設定

ここまでの設定が終了すれば, 適切にコンパイル時の引数を渡した上でそれぞれのライブラリを用いたプログラムをコンパイルし実行できますが, IDE上では別途コンパイラの設定をする必要があるためCLionではこのままだと使えません. CLionではプロジェクトを作成した時に自動でCMakeLists.txtが作成されてこれを元にリンクやパスの設定がなされます. これに対応したcmakeファイルがgitHubで公開されているので, ありがたく使わせていただくことにします.

GitHubのページからzipダウンロードもしくは各種gitツールからcloneする(ページの右あたりのClone or downloadからダウンロードできます).
それぞれのcmakeファイルを, プロジェクトのディレクトリ/cmake-build-debug/cmake内にコピーする. cmakeディレクトリはなければ適宜作成.
/usr/local/lib/cmake内にSDL2_image, SDL2_mixer, SDL2_ttfディレクトリを作成し, それぞれに以下のファイルを作成.

SDL2_image/SDL2_imageConfig.cmake

set(prefix "/usr/local") 
set(exec_prefix "${prefix}")
set(libdir "${exec_prefix}/lib")
set(SDL2_IMAGE_PREFIX "/usr/local")
set(SDL2_EXEC_IMAGE_PREFIX "/usr/local")
set(SDL2_IMAGE_LIBDIR "${exec_prefix}/lib")
set(SDL2_INCLUDE_IMAGE_DIRS "${prefix}/include/SDL2")
set(SDL2_IMAGE_LIBRARIES "-L${SDL2_IMAGE_LIBDIR}  -lSDL2_image")
string(STRIP "${SDL2_IMAGE_LIBRARIES}" SDL2_IMAGE_LIBRARIES)

SDL2_mixer/SDL2_mixerConfig.cmake

set(prefix "/usr/local") 
set(prefix "/usr/local") 
set(exec_prefix "${prefix}")
set(libdir "${exec_prefix}/lib")
set(SDL2_MIXER_PREFIX "/usr/local")
set(SDL2_EXEC_MIXER_PREFIX "/usr/local")
set(SDL2_MIXER_LIBDIR "${exec_prefix}/lib")
set(SDL2_INCLUDE_MIXER_DIRS "${prefix}/include/SDL2")
set(SDL2_MIXER_LIBRARIES "-L${SDL2_MIXER_LIBDIR}  -lSDL2_mixer")
string(STRIP "${SDL2_MIXER_LIBRARIES}" SDL2_MIXER_LIBRARIES)

SDL2_ttf/SDL2_ttfConfig.cmake

set(prefix "/usr/local") 
set(exec_prefix "${prefix}")
set(libdir "${exec_prefix}/lib")
set(SDL2_TTF_PREFIX "/usr/local")
set(SDL2_TTF_EXEC_PREFIX "/usr/local")
set(SDL2_TTF_LIBDIR "${exec_prefix}/lib")
set(SDL2_TTF_INCLUDE_DIRS "${prefix}/include/SDL2")
set(SDL2_TTF_LIBRARIES "-L${SDL2_TTF_LIBDIR}  -lSDL2_ttf")
string(STRIP "${SDL2_TTF_LIBRARIES}" SDL2_TTF_LIBRARIES)

プロジェクトのCMakeLists.txtに以下を追加する. projectは各自プロジェクト名(project()で指定したもの )に置き換えてください.

CMakeList.txt

set(CMAKE_MODULE_PATH "${CMAKE_CURRENT_SOURCE_DIR}/cmake")

find_package(SDL2 REQUIRED)
find_package(SDL2_mixer REQUIRED)
find_package(SDL2_image REQUIRED)
find_package(SDL2_ttf REQUIRED)

include_directories(${SDL2_INCLUDE_DIRS})

target_link_libraries(project ${SDL2_LIBRARIES})
target_link_libraries(project ${SDL2_TTF_LIBRARIES})
target_link_libraries(project ${SDL2_IMAGE_LIBRARIES})
target_link_libraries(project ${SDL2_MIXER_LIBRARIES})

その他のファイルの用意

今回は簡単のためcmake-build-debugに各種ファイルを置き実行します.
IPAフォントからipag.ttfをダウンロードし, プロジェクトのcmake-build-debug内にコピーしてください.
また, 各自wavファイルとpngファイルを用意しそれぞれtest.wav, test.pngとリネームして, プロジェクトのcmake-build-debug内に置いてください.

以上で環境導入は完了です.

実行

今回はせっかくIDEを使うので, 音を鳴らすクラスSoundTestクラス, 画像を表示するクラスImageTestクラス, 図形を表示するFigureTestクラス, 文字を表示するTextTestクラス, それらを統括するSDLTestクラスを作成しましたgitHub. Clionの左上のプロジェクト名が表示されているところを右クリックし, new > c++ class を押してそれぞれのファイルを作成し内容を記述するか, ファイルをダウンロードしてプロジェクトのディレクトリ(main.cppがある場所)にコピーし, CMakeLists.txtに

CMakeLists.txt

add_executable(project main.cpp 
                       SoundTest.cpp SoundTest.hpp
　　　　　　　　　　　　　　ImageTest.cpp ImageTest.hpp
　　　　　　　　　　　　　　FigureTest.cpp FigureTest.hpp
　　　　　　　　　　　　　　TextTest.cpp TextTest.hpp
                       SDLTest.cpp SDLTest.hpp)

を追加してください(project は適宜置き換えてください, すでにmain.cpp以外に
add_executableされている場合は, それらも残してください).
main.cppを以下のように記述し実行して所望の結果が得られれば成功です.

main.cpp

#include "SDLTest.hpp"

int main() {
    auto *obj = new SDLTest();

    obj->mainCall(30);
    return 0;
}

動くかだけチャチャっと確認したいしたい人はgitHub内のmain_only_verのmain.cppだけをコピーして実行してみてください.

参考にさせていただいたサイト
Qiita: MacでのSDLの導入
 [Mac OS] [freetype] ソースからfreetype-2.8.1をインストールする
 SDL2 の適当なサンプルコード
 sdl2-0でpng画像と文字列を表示
 gitHub: Using SDL_Mixer with SDL2

MacOS版CLionでSDL2を使う際の覚え書き