Bit

使い方

セットアップ

bit init --package-manager yarn
bit import --compiler bit.envs/compilers/react-typescript
bit login
bit config # to show config

hook 関連のエラー (opens new window)が出るため、package.json に下記を追加しておくこと

{
  "bit": {
    "overrides": {
      "*": {
        "dependencies": {
          "react": "-"
        },
        "peerDependencies": {
          "react": "+"
        }
      }
    }
  }
}

Bit.dev へのエクスポート

bit add src/components/MyComponentFolder
bit show <component_name>　# 依存関係が正しいか確認する(ReactがpeerDependenciesになっているかなど)
bit status # コンポーネントが一覧に表示されること

bit build
bit tag --all 0.0.1
bit status # stagedになっていること

bit export <username>.<collection_name>
bit status # 空になっていること

bit list # local scopeの部分にexportしたコンポーネントが記載されている

他のプロジェクトで使う

# 他のプロジェクトで
yarn add @bit/<username>.<collection_name>.<component_name>

他のプロジェクトで編集する

# (package.jsonに記載された依存先のバージョンの部分がローカルファイルを指すようになる)
bit import <username>.<collection_name>/<component_name>

# 編集する

bit tag <component_name>
bit export <username>.<collection_name>

# 元のプロジェクトで
bit import
# この状態ではまだ新しいパッケージは使われない
bit status
# 新しいパッケージを使うには
bit checkout 0.0.4 <component_name>

削除

# リモートからパッケージを消す
bit remove username.your-collection/foo/bar --remote