SFDC：react-lightning-design-systemをnpm installで組み込む手順

react-lightning-design-systemを自分のプロジェクトに組み込む手順についてです。

https://github.com/stomita/react-lightning-design-system

react-lightning-design-systemはnpmパッケージで公開されているので、npm installコマンドで簡単に利用できるようになります。

$ npm install react-lightning-design-system --save

インストール後は、次のようにimportすることで利用できます。(ボタンコンポーネントの場合)

import { Button } from 'react-lightning-design-system';

export default React.createClass({
  render() {
    return <Button type='brand'>Brand</Button>
  }
})

これでボタンが表示できました。

細かい使い方はreact-lightning-design-systemリポジトリのexamplesフォルダのサンプルアプリで確認できそうです。

Lightning Design Systemの読み込み

react-lightning-design-systemはnpm installコマンドで利用できるようになりますが、Lightning Design SystemのCSSはきちんと読み込む必要があります。