Not reloading php partials in WordPress

[ianhempsell]

I'm having issues with Wordpress, Webpack 4 and Browsersync.

Using the following within my webpack.config, reloads all .PHP pages in the /root/ of my theme as expected:

new BrowserSyncWebpackPlugin({ proxy: proxy, files: ['*/.php'], })

But any 'included' .PHP files that are located within directories are recognized as changed within the console but do not reload the browser. An example:

/page.php loads in a template part from /template-parts/part.php

When changing the /template-parts/part.php, the console updates with [Browsersync] Reloading Browsers...

But the page content does not update as expected. If you manually refresh, the change is shown.

I have tried changing my BrowserSyncWebpackPlugin to use the following, but this does not work either

{ match: ["*/.php"], fn: function (event, file) { this.reload() } }

Is it possible to reload the browser when a .PHP partial changes?

[malinbranduse]

@ianhempsell Try this

new BrowserSyncPlugin(
    {
        host: "localhost",
        port: 3000,
        proxy: "http://mysite.test/",
        files: ["**/*.php"],
        notify: true
    },
    {
        reload: true,
        injectCss: true
    }
)

[ianhempsell]

@malinushj, thanks but that doesn't work. I still have to manually refresh the page.

[malinbranduse]

Are you sure you're using the proxy properly? try using localhost:3000 directly in the browser

[ianhempsell]

I was being an idiot and forgot to include the wp_header/footer in my template part.

This works as expected with minimal config:

new BrowserSyncWebpackPlugin({ proxy: proxy, files: ['*/.php'], }),

Sorry, Ian.