前提・実現したいこと
xamppのローカルサーバー上のWordPressにおいて、gulpのbrowser-syncを利用して
phpファイルが更新されるたびに、WordPressトップページのブラウザが自動更新されるような環境にしたいです。
発生している問題
現在の状態としては、「gulp」コマンドをコマンドプロンプト上で叩くと、
WordPressのトップページのブラウザが立ち上がるようになっています。(127.0.0.1:80/wordpress)
ここまでは問題ないのですが、
phpファイルを更新すると、本当なら立ち上がっているWordPressのトップページのブラウザが自動更新(リロード)されるのが
理想なのですが、自動更新が全く発生しません。
よくよく調べてみると、なぜか「http://localhost:3000/dashboard/」の方が更新(リロード)されていました。
(ファビコン部分がクルクルと更新マークになるので、確かにこちらで更新されています。)
「browserSync」のproxiに自動更新したいWordPressのトップページのブラウザを指定しています。
「browserSync」が立ち上がる際には問題ないのですが、
リロードが発生すると、自動更新先は「http://localhost:3000/dashboard/」になってしまうのが
解せません。
どうすれば、WordPressのトップページのブラウザで自動更新されるようにできるのか教えて頂けないでしょうか?
該当のソースコード
下記、gulpfile.jsの記述です。
// 各種プラグインの読み込み var gulp = require("gulp"); var browserSync = require("browser-sync"); // ブラウザ反映 var phpConnect = require('gulp-connect-php');// PHPと接続 // 各種タスク // サーバーを立ち上げる(connectsync) gulp.task("connectsync", function (done) { phpConnect.server({ port: 80, keepalive: true, base: "." }, function (){ browserSync({ proxy: '127.0.0.1:80/wordpress' }); }); }); // 保存時のリロード(bs-reload) gulp.task("bs-reload", function (done) { browserSync.reload(); done(); }); // 監視(watch) gulp.task("watch", function (done) { gulp.watch("*.php", gulp.task("bs-reload")); //phpが更新されたらbs-reloadを実行 done(); }); // 「gulp」コマンドをコマンドプロンプトで打つと、「watch」、「connectsync」の処理が走る gulp.task("default", gulp.series(gulp.parallel("watch","connectsync")));
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。