[yuta]

【お使いの Snow Monkey のバージョン】最新版
【お使いの Snow Monkey Blocks のバージョン】最新版
【お使いの Snow Monkey Editor のバージョン】最新版
【お使いのブラウザ】Google Chrome
【当該サイトのURL】https://preprente.yuta-blog.website/

### 実現したいこと
jsファイルのエラーを解消したい

### 発生している問題
ローカル環境ではエラーが出ないのに、本番環境に上げた途端エラーが出てしまいます。
エラー文：Uncaught ReferenceError: jQuery is not defined at common.js?ver=5.7:1

### 試したこと
本番環境に反映させる際は、All in One WP Migrationプラグインを使っています。
jsファイルもローカル環境同様のものがしっかり読み込まれているはずなのですが、
本番環境ではエラーが出てしまいます。
これは、jsファイルのコードが原因なのでしょうか？
原因と解決策がわかっていないので、
サポートフォーラムで聞くような原因でないものでしたら、すみません。

【my-snow-monkey.php】

// jsファイルの読み込み
add_action( 'wp_enqueue_scripts', function() {
	wp_enqueue_script(
		'customize',
		untrailingslashit( plugin_dir_url( __FILE__ ) ) . '/assets/js/common.js',
		[ get_template() ],
		false,
		true
	);
} );

【common.js】

jQuery(function ($) {
	// 固定ページのサイドバー
	jQuery(".estate")
		.parents(".l-contents__inner")
		.find("#custom_html-3")
		.css("display", "none");
	jQuery(".entertainment")
		.parents(".l-contents__inner")
		.find("#custom_html-4")
		.css("display", "none");

	// お問い合わせ（子ページ）タイトルのtext-shadow消し
	jQuery(".contact-entertainment")
		.parents(".l-contents")
		.find(".c-page-header__title")
		.css("text-shadow", "none");
	jQuery(".contact-real-estate")
		.parents(".l-contents")
		.find(".c-page-header__title")
		.css("text-shadow", "none");
}

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

Uncaught ReferenceError: jQuery is not defined at common.js は、common.js で jQuery を使っているけど jQuery が定義されていませんよという意味です。

common.js より先に jQuery のファイルを読み込む必要がありますが、common.js の読み込みの依存関係に jquery が指定されていないようです。下記のように変更してください。

add_action(
	'wp_enqueue_scripts',
	function() {
		wp_enqueue_script(
			'customize',
			untrailingslashit( plugin_dir_url( __FILE__ ) ) . ‘/assets/js/common.js’,
			[
				'jquery', // ← jQuery を読み込んだ後に common.js を読み込む
				\Framework\Helper::get_main_script_handle(), // ← get_template() と指定されていましたが、これは正しくないです。ちなみにこれは Snow Monkey のメイン js を依存指定することになります。
			],
			false,
			true
		);
	}
);

あと、これは本筋とそれますが、common.js の中に書いているのがスタイルの指定のようなので、js より CSS で記述したほうが体感速度的には良いのではないかと思いました。

♥ 2

いいねをした人: 居ません

[yuta]

なるほど、そういうことだったのですね！
上手く動作しました。ありがとうございます！

特定のページのページタイトルのみにスタイルを当てるために、
このような回りくどいことをやったのですが、
bodyのクラスにpage-id-◯というのが付与されていましたね。
追加CSSでできますね。

jsファイルのエラーについて質問したのですが、別のことにも気づかせていただきました！
ありがとうございました。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

解決できてよかったです。トピック閉じます！

♥ 0

いいねをした人: 居ません

[投稿者]

投稿