Browsersync doesn’t set the right local url

I’m working on a WordPress project using the starter theme Roots with Gulp in association with MAMP PRO. I’m experiencing a problem with the ‘watch’ task from the gulpfile.js.
Here below is the code of the task:

gulp.task('watch', function() {
  browserSync({
    proxy: "mywebsite:8888",
    port: 8888,
    open: "internal"
  });
  gulp.watch([path.source + 'styles/**/*'], ['styles']);
  gulp.watch([path.source + 'scripts/**/*'], ['jshint', 'scripts']);
  gulp.watch(['bower.json'], ['wiredep']);
  gulp.watch('**/*.php', function() {
    browserSync.reload();
  });
});

And this is the terminal output after launching the ‘gulp watch’ command:

Read More
gulp watch
[12:46:32] Using gulpfile ~/Dropbox/_sites/mywebsite/wp-content/themes/mywebsitetheme/gulpfile.js
[12:46:32] Starting 'watch'...
[12:46:37] Finished 'watch' after 4.26 s
[BS] Proxying: http://mywebsite:8888
[BS] Now you can access your site through the following addresses:
[BS] Local URL: http://localhost:8888
[BS] External URL: http://192.168.22.168:8888

As a result browsersync open, with my default browser, the url http://localhost:8888.

What I need now is, basically, that the resulting url (opened by the browser) is http://mywebsite:8888.

Related posts

Leave a Reply

1 comment

  1. Issue solved thanks to bower community member (github issue)
    I just need to delete any configuration option and add the snippet below before the closing tag:

    <script type='text/javascript' id="__bs_script__">//<![CDATA[
        document.write("<script async src='//HOST:PORT/browser-sync/browser-sync-client.2.1.0.js'></script>".replace(/HOST/g, location.hostname).replace(/PORT/g, location.port));
    //]]></script>