Skip to content

プラグインマイグレーション (v2.0.0 beta.5 to rc.1)

ci7lus edited this page Jun 25, 2022 · 3 revisions

v2.0.0-rc.1においてウィンドウ間のデータの同期に用いていた処理をrecoil-syncを用いて書き換えたことにより、Atom値の共有・保存をsharedAtoms, storedAtomsの値ではなくatom.effectsで指定するようになりました。

具体的な実装

sharedAtomsが以下のようになっていた場合

    sharedAtoms: [
      {
        type: "atom",
        atom: settingAtom,
      },

こうします

import { syncEffect } from "recoil-sync"
import $ from "@recoiljs/refine"

export const HogehogeRenderer: InitPlugin["renderer"] = ({
  constants,
}) => {
  const settingRefine = $.object({
    accessToken: $.voidable($.string()),
    isEnabled: $.withDefault($.boolean(), true),
  })
  const settingAtom = atom<SettingTyping>({
    key: `hogehogeplugin.setting`,
    default: { isEnabled: true },
    effects: [
      syncEffect({
        storeKey: constants?.recoil?.sharedKey,
        refine: settingRefine,
      }),

また、recoil-syncはホスト側のものを使用する必要があるため、 webpack.config.ts

      externals: {
        'recoil-sync': "'RecoilSync' in globalThis?RecoilSync:{}",

となりますが、この場合後方互換性はなくなります。 どちらにせよベータ段階のものが使えなくなるだけなので構わないのですが、後方互換性を保った実装を行う場合はrecoil-syncのプリバンドルとalias実装を参照してください。