Bootstrap3をダウンロードしてきたら、解凍して、下の構造になっています。
$ tree -L 2 bootstrap-3.3.4-dist/
bootstrap-3.3.4-dist/
├── css
│ ├── bootstrap-theme.css
│ ├── bootstrap-theme.css.map
│ ├── bootstrap-theme.min.css
│ ├── bootstrap.css
│ ├── bootstrap.css.map
│ └── bootstrap.min.css
├── fonts
│ ├── glyphicons-halflings-regular.eot
│ ├── glyphicons-halflings-regular.svg
│ ├── glyphicons-halflings-regular.ttf
│ ├── glyphicons-halflings-regular.woff
│ └── glyphicons-halflings-regular.woff2
└── js
├── bootstrap.js
├── bootstrap.min.js
└── npm.js
3 directories, 14 files
そして新しいphoenixプロジェクトを作成します。
$ mix phoenix.new hello --no-brunch
-
bootstrap-3.3.4-dist/css/
ディレクトリしたのファイルをすべてphoenixのプロジェクトhello/priv/static/css/
ディレクトリ下移動します。 -
bootstrap-3.3.4-dist/fonts/
ディレクトリをphoenixプロジェクトhello/priv/static/
ディレクトリ下に移動します。 -
bootstrap-3.3.4-dist/js/
ディレクトリ下のファイルをすべてphoenixプロジェクトhello/priv/static/js/
ディレクトリ下移動します。
使うときに例としてはhello/web/templates/layout/application.html.eex
ファイルの<head>
タグに下の2行を追加するとどのファイルでも使えるようになります。
<link rel="stylesheet" href="<%= static_path(@conn, "/css/bootstrap.css") %>">
<link rel="stylesheet" href="<%= static_path(@conn, "/js/bootstrap.js") %>">