AntdのCSSをインポートする方法


AntdのCSSをインポートするには、以下の手順に従います。

  1. Antdのインストール: Antdをプロジェクトに追加するには、npmまたはyarnを使用してAntdをインストールします。以下のコマンドを使用します。

    npm install antd

    または

    yarn add antd
  2. CSSファイルのインポート: Antdのスタイルをインポートするためには、CSSファイルをプロジェクトに追加する必要があります。一般的には、importステートメントを使用してCSSファイルをインポートします。以下のようなコードを追加します。

    import 'antd/dist/antd.css';

    上記のコードでは、antd.cssファイルをインポートしています。

  3. コンポーネントの使用: Antdのコンポーネントを使用する準備が整いました。必要なコンポーネントをインポートして使用することができます。以下は、Buttonコンポーネントの例です。

    import React from 'react';
    import { Button } from 'antd';
    const App = () => {
     return (
       <Button type="primary">Click me</Button>
     );
    }
    export default App;

    上記の例では、Buttonコンポーネントをインポートし、<Button>タグで使用しています。

以上が、AntdのCSSをインポートする方法の基本的な手順です。これにより、Antdのコンポーネントが適切なスタイルで表示されるはずです。必要に応じて、他のAntdコンポーネントも同様にインポートして使用することができます。