@directsourcing/direct-ui NPM

プロジェクト名

株式会社ダイレクトソーシングのデザインシステムのデザイントークンとコンポーネントライブラリを実装したパッケージです。 React と Tailwind CSS で作られています。

インストール

npm i @directsourcing/direct-ui

セットアップ

1. Tailwind CSS を導入

Tailwind CSS の CSS を読み込む

index.css (名前は任意) を作成
- 以下の内容を置く

@tailwind base;
@tailwind components;
@tailwind utilities;

app.tsx で index.css を読み込む

`postcss.config.js` の作成

postcss.config.js が存在しない場合は作成する。
以下を追加

plugins: {
  tailwindcss: {},
  autoprefixer: {},
  // ...
}

2. Direct UI の設定を読み込む

preset の読み込み

以下のどちらかを使用

CommonJSの構文

preset: [require('@directsourcing/direct-ui/tailwind.config.js')],

ESモジュールの構文

import directUiTailwindConfig from "@directsourcing/direct-ui/tailwind.config.js";
  presets: [directUiTailwindConfig],

ライセンス

MIT License

react storybook ui-components design-system

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

0.1.51--canary.bcbb97a.0

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

0.1.50--canary.6bd6cad.0

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

プロジェクト名

インストール

セットアップ

1. Tailwind CSS を導入

Tailwind CSS の CSS を読み込む

postcss.config.js の作成

2. Direct UI の設定を読み込む

preset の読み込み

ライセンス

`postcss.config.js` の作成