カスタムエレメントVer1からVer2への、安全で具体的な移行手順書を記載します。
既にカスタムエレメントVer1を使ってサイト内検索を提供しているお客様が対象となります。
本番環境とは別に、ステージングなどで動作確認する環境が必要です。
最初に、ステージング環境にて強制的にカスタムエレメントVer2 を読み込ませるようにします。
検索窓画面と検索結果画面のページ内、以下2箇所を修正します。
【1箇所目】次のlinkタグを削除
<link href="https://ce.mf.marsflag.com/latest/css/mf-search.css" rel="stylesheet" type="text/css" media="all" charset="UTF-8">【2箇所目】次のscriptタグを変更
変更前
<script src="https://ce.mf.marsflag.com/latest/js/mf-search.js" charset="UTF-8"></script>変更後
<script
src="https://ce.mf.marsflag.com/v2/js/mf-search.js"
async
type="module"
></script>※ /v2/ というパスを指定することで、強制的に Ver2を読み込ませることができます。
１．を適用した後、検索窓画面と検索結果画面を確認し、必要であればページを修正して調整します。
動作や画面レイアウトを調整する際には、以下のドキュメントを参照してください。
２．の作業後、そのままステージングの内容を本番へ反映します。
１．にて指定していた scriptタグを、以下のように通常状態へ戻します。
現在
<script
src="https://ce.mf.marsflag.com/v2/js/mf-search.js"
async
type="module"
></script>修正後
<script src="https://ce.mf.marsflag.com/latest/js/mf-search.js" charset="UTF-8"></script>
※ /v2/ を /latest/ というパスに戻すことで、強制的な Ver2読み込みを解除します。
５．の作業後、そのままステージングの内容を本番へ反映します。
以上