React JSで天気アイコンを使用するには？

Question

したがって、Reactアプリケーションでweather-iconsを使用しようとしています。

私はpackageをダウンロードし、私の解決策（here）に追加しました。

（私はreact-redux-universal-hot-exampleスターターキットを使用）

私は次のように追加Forecast.jsコンテナで：

import React, {Component, PropTypes} from 'react'; 
 
import {connect} from 'react-redux'; 
 
import {fetchForecast} from 'redux/modules/weatherForecast'; 
 

 
@connect(
 
    state => ({forecast: state.weatherForecast.forecast}), 
 
    {fetchForecast} 
 
) 
 
export default class Forecast extends Component { 
 
    render() { 
 

 
    return (
 
     <div> 
 
      <i className="wi wi-day-sunny"></i> 
 
     </div>); 
 
    } 
 

 
}

それはまだ動作しません...

1. これらのクラスがコンテナに認識されるように天気アイコンをどのように参照するのですか？
2. css以下のフォルダが必要ですか？ （私はスターターキットには、これを使用しているので、SCSSを使用することを好む）

私のコードの構造：

[src] 
|--[containers] 
|  |--[Forecast] 
|    |--Forecast.js 
| 
|--[weather-icons] 
     |--[css] 
     |--[font] 
     |--[less] 
     |--[sass] 
     |--[values] 

My source code

Answer 1

一つの方法は、直接CSSファイルをインポートしているが、 （記載の通りhere）

import 'weather-icons/css/weather-icons.css'; 

注：パスは変更できます。 weather-iconsパッケージをnpmを通してインストールしました。これは、node_modulesの下にあることを意味します。

cssファイルをインポートした後、以下のように使用できます。

<i className="wi wi-day-lightning"></i>