SharePoint Frameworkで作成したWebパーツを、パッケージ化・展開する方法をご紹介します。
バンドル(複数のスクリプトを1つのファイルにまとめる)
VIsual Studio Codeのメニューから、 [ターミナル] > [新しいターミナル] の順にクリックします。
表示されたターミナルに、以下のコマンドを入力し、[Enter] を押します。
gulp bundle --ship
コマンドの実行が完了すると、「temp」フォルダーが作成され、中にはバンドルされたファイルがはいっています。
パッケージ化
ソリューションをパッケージ化します。 以下のコマンドを実行します。
gulp package-solution --ship
実行が完了すると、「sharepoint」フォルダーが作成され、その中にパッケージファイル(<Webパーツ名>.sppkg)があります。
このパッケージファイルを、アプリカタログにアップロードすることで、Webパーツを展開することができます。
パッケージファイルをアプリカタログにアップロード
アプリカタログを開き、先程作成したパッケージファイルをアップロードします。
確認画面が表示されるので、[展開] をクリックします。
これで作成したWebパーツが展開できました。
サイトにアプリをインストール
作成したWebパーツを利用するには、Webパーツを利用するサイトでインストールしなければいけません。
サイトを開き、ホーム画面から [新規] > [アプリ] の順にクリックします。
アプリの一覧の中から、作成したWebパーツを選択します。
選択すると、選択したアプリがインストールされます。
※インストールには時間がかかる場合があります。
インストールが完了すると、Webパーツが利用できるようになっています。
以上、Webパーツアプリの展開方法でした。
補足
Visual Studio Code の拡張機能を使えば、gulp serve から アプリカタログへの展開まで簡単にできるようになります。