SPFX と流暢な UI に特化したプロジェクト間でコードをほとんど共有する方法を探していました。そのための 3 つの主な方法を見つけました。
1. コンポーネント ライブラリの作成は、同じインフラストラクチャを使用し、構成する必要なくすべてのビルドを行うため、最も複雑に見えない方法です。
ただし、これによりいくつかの問題が追加されます。ソリューションをローカルでビルドして手動でリンクして機能させる必要があります。これは、リポジトリに配置した場合にも機能します。なので軽減されます。2 つ目は、暗黙のうちに流暢な UI と反応が必要になることです。さらに、SPFX コンポーネント ライブラリ プロジェクト内に配置する必要があります。
2. ts でパスを使用すると、いくつかの約束があり、これは ts コンパイラを使用している間は正常に機能します。プロジェクトが参照しているフォルダーに移動し、呼び出し時にビルドします。これは素晴らしいことです。ただし、SPFX では機能しませんでした。
3. もう 1 つの方法は、インストール後にフォルダを同期することでした。これは簡単に思えますが、これがどれほど実用的であるか、また、人々がどのようにそれを行っているか、もしそうなら、どのようにしているのか疑問に思います。
私が今理解したかったのは、コンポーネント コードを取得して、それらが私の src のフォルダーまたはコードの単純な拡張にあるかのように共有する方法だけです。追加の依存関係やビルド手順は不要で、ts/tsx ファイルとして使用できるコードだけです。元：
共有ライブラリ:
//assuming I have react and fluentui already installed for the project.
import button from 'fluentui';
export const fancyCustomButtom = (props) => {
return (<Button text="Standard" />);
};
src プロジェクト フォルダー:
import {fancyCustomButtom} from 'shared-lib'
使用する前にファイルをビルドする必要がある場合は問題ありませんが、ビルド時またはパッケージのインストール時に実行できますか? また、両方のモジュールを既に利用可能なもの (react、fluentui) に依存させることで、バンドルのサイズを増やしませんか?