slickで実装したカルーセルのCSSが、railsの本番であたらない

Question

railsプロダクションで、下記のslickのライブラリを使って、カルーセルを実装しました。
https://kenwheeler.github.io/slick/

下記の内容です。

# application.css

.
.
 *= require slick-carousel/slick/slick
 *= require slick-carousel/slick/slick-theme
 *= require home
.
.

# home.css

.slick-prev:before,
.slick-next:before {
  color: #000 !important;
}

# application.js
.
.
//= require slick-carousel
//= require home
.
.

# home.js
$(function(){
  $('.slider').slick({
    autoplay: true,
    centerMode: true,
    centerPadding: '10%',
    autoplaySpeed: 5000,
    dots: true,
    arrows: true,
    dotsClass: 'slick-dots'
  });
});

この内容で本番環境にデプロイしました。
sproketsを使って静的ファイルを配置しています。

下記の通り本番環境のCSSはおかしいです。
どうすれば、本番環境でもCSSは当たるのでしょうか

• ローカル

矢印とドットにCSSが当たっている

• 本番環境

矢印とドットにCSSが当たっていない

---

font-family: 'slick' が当たってないみたいです。

Comments

[m.ts10806]

URLみてないですけど、URLからすると画像ですかね。
外部サービスではなくteratailの画像投稿機能を利用してください。

[axax90]

画像アップロードできるんですね。知らなかったです。
アップしました。

[m.ts10806]

「本番」のほうをブラウザで表示したときに
デベロッパツールのコンソールにエラー出てませんか？
コンパイル通ってない（CSSが配置されてない）ということは考えられなくもないです。

[axax90]

特にエラーは無かったです。。
もうsproketsに入れるのはやめました。。
すみません。

Answer 1

Precompileをすると、ライブラリの内容がおかしくなってるのかもしれないです。。分からないですが...
sprocketsに入れなければ大丈夫でした。当たり前ですが。。