[ 解決済 ] lightning 15.3.0以降でTree Shakingを有効化するとサイト全体の表示が崩れる
[ 解決済 ] lightning 15.3.0以降でTree Shakingを有効化するとサイト全体の表示が崩れる
- このトピックには13件の返信、4人の参加者があり、最後に
により1年、 3ヶ月前に更新されました。
-
投稿
-
■ WordPress のバージョン
6.1.1■ テーマ・プラグインは全て最新版で確認してください。
確認しました。■ 子テーマをご利用の場合は親テーマに変更して症状が改善するか確認してください。
確認しました。■ テーマの種類
Lightning ( G3 ) + Lightning G3 Pro Unit■ テーマのバージョン
15.4.0■ Pro Unit のバージョン
0.23.4■ スキンの種類
Evergreen■ スキンのバージョン
0.2.1■ 関連しそうなプラグインを一つづつ停止して症状が改善するか確認してください。
確認しました。■ 期待する動作
Tree Shakingを有効化した状態で、lightning 15.2.4から15.4.0にアップデートすると、グローバルメニュー、パンくずリスト、ページヘッダー等の表示が崩れてしまいます。
(15.3.0から同様の事象が発生しております）また、フッターウィジェットエリアにもナビゲーションメニューブロックを入れておりますが、こちらも表示が崩れます。
またPC表示にもかかわらず、フッターの下にモバイル用のメニュー(#vk-mobile-nav)が出現します。■ 自分で試した事
テーマのロールバックと更新を繰り返し、差異を比較
15.4.0でTree Shakingを無効にすると、表示は正常に戻ることがわかりました。
15.2.4ではTree Shakingを有効化していても表示は正常でした。■ 症状が発生するブラウザ
Google Chrome■ 実際の症状
ヘッダーのnavタグ(#global-nav)にCSS(/themes/lightning/_g3/assets/css/style.css)が当たっていないようです。
細かく検証できていませんが、他にもCSSが当たっていない要素があります。Tree Shakingを無効化すれば、とりあえずは問題ないのですが
PageSpeedInsightsでCLS等のスコアも落ちてしまいますので
現状は15.2.4でTree Shakingを有効にして使い続けています。15.3.0以降Tree Shakingの有効化が機能しなくなる要件などありましたらご教授いただければ幸いです。
■ その他特記事項
PHPバージョン：8.1.12
Nginxバージョン：1.23.2該当URL : https://*********※該当URLはフォーラムライセンスが有効のユーザーにのみ表示されます
ご報告ありがとうございます。
標準状態では有効にしても崩れないので、何か他のプラグインが出力するCSSがトリガーになって Tree Shaking が正常に動作しないのかもしれません。プラグインを停止して改善したりしますか？
ご返信ありがとうございます。
全てのプラグインを無効にしましたが、状況は変わりません。
なお、lightning（親テーマ）を有効にして起きている事象です。ご参考までに15.2.4（表示正常）と15.4.0（表示崩れ）の同一ページの
ソースコードの比較を添付いたします。（どちらもTree Shaking有効化状態）15.4.0では一部のCSSファイルが読み込まれていないようです
ExUnit > 有効化設定 で CSS最適化が有効になっていますでしょうか？
有効になっていたら無効化してください。
（Lightning や VK Blocks で同じライブラリを読み込んでおり、現状 ExUnit に入っているライブラリはバージョンが古い）CSS最適化を無効にしましたが、状況変わりません。
前回、全てのプラグインを無効化して状況変わらないとご説明した際は
VK All in One Expansion Unitも含めて無効化しております。利用プラグインの干渉の可能性で言うと
サーバーはXserver VPSで、KUSANAGIという実行環境でWordpressを動かしております。
こちらはデフォルトでKUSANAGI専用プラグインが入っており、無効化はできないのですが…はい、キャッシュは都度削除しております。
ブラウザもスーパーリロードしています。KUSANAGIにはWebサーバー(nginx)側でキャッシュを保持するfcacheと、
Wordpressでキャッシュを保持するbcacheという機能がありますが
こちらも全て機能をオフにして確認しましたが、状況は変わりませんでした。例えばローカルの開発環境などに複製してプラグインを停止しても崩れますか？
ローカル環境（KUSANAGI無し）で確認したところ、Tree Shakingを有効にしても表示は崩れませんでした。
プラグインを一切インストールせず（G3 Pro UnitやVK Blocks Proなども入れない）
LightningのテーマのみインストールしたWordpress環境で
①KUSANAGI無し、Tree Shaking有効
②KUSANAGI有り、Tree Shaking有効
の2パターンの環境で同じデータをインポートしたところ
①では正常、②では表示崩れが起きましたので、KUSANAGIが原因の可能性が高そうです。KUSANAGIはサーバーの実行環境そのものなので、止めることができず
KUSANAGIの入っていないサーバー環境を一から作り直すか、現行のサーバーでTree Shakingを無効にするか
表示速度を考えると、どちらの方がいいのか、悩ましいところです…Lightning 15.2.4まではKUSANAGI環境でもTree Shakingが機能していたので
またTree Shakingが使えるようにして頂けると嬉しいです…
（すみません、技術的な背景がわからない個人の勝手な要望です）今回の頂戴致しましたご意見は社内で検討させていただきます。
※可能な限り検討させていただきたく思いますが、
検討して初めて分かることもあるため、全てを実装することは難しい場合もございます。今後ともLightningをよろしくお願いいたします。
今回のKUSANAGIの問題とは別とは思いますが、
Tree Shaking 関連のライブラリをアップデートしましたので、もしかしたら以下の組み合わせで改善するかもしれません。
Lightning 15.5.1 / VK Blocks Pro 1.50.１ご連絡ありがとうございます。残念ながら改善しませんでした。
Lightning 15.2.4 / VK Blocks Pro 1.48.1.0の組み合わせまでは
KUSANAGI環境でTree Shaking有効化しても表示は崩れないのですが
テーマかプラグインのどちらか（もしくは両方）を更新すると、表示が崩れます。
いずれも、Tree Shakingを無効にすると表示は正常になります。あぁ…概ね原因はわかりました。
KUSANAGI固有の認証設定の問題のようで対応また検討してみます…。
- このトピックに返信するにはログインが必要です。
