I user browser sync for live reloading and css injection with kirby. Everything works fine, but when I try to ignore the admin panel, so that all panel pages wonât reload if I change a file, I get a weird behaviour. Although the panel shouldnât reload, it reloads and and redirects to the login page and this error occurs (it seems that api/system?view=panel
is not found).
Without the ignorePaths: 'panel/**'
setting everything in the panel works fine.
This are my browser sync options (used together with a valet dev server)
{
proxy: 'my-project.test',
snippetOptions: {
ignorePaths: 'panel/**',
},
files: [
'assets/**/*.js',
'assets/**/*.css',
'site/templates/**/*.php',
'site/snippets/**/*.php',
]
}
I do it by loading the front end via the browser sync localhost:3000 URL, and on another browser tab i open the panel via âmy-project.test/panelâ. This gets round the panel reload.
I disabled content locking, the behaviour is the same but the error messages changed to NetworkError when attempting to fetch resource.
It would be great if everything works under one server (it might be confusing using the preview link from the panel and than having a front end page open with the wrong server), but your solution looks like a good workaround for now!
But they are infact the same server. Browserync is just proxying the âmy-project.testâ local domain so that it can inject its javascript into the page. Thats why you dont get the reload on it.
Another thing you can do is use the Vivaldi browser which lets you do split screen tabs - you can have the panel in the left side and the front end on the right.
This way you can have both open at the same time without having to flick between browser tabs.
Thanks for the infos! Youâre right, it is the same server. But still I find it not very elegant to use two different hostnames (localhost:3000
and my-project.test
) when working on the same website. Ideally it should all work within browsersyncâs proxy with the ignorePaths
option. What I do now is running browsersyncâs proxy with the same hostname as the dev server. So I have my-project.test
for the panel and my-project.test:3000
for live reloading pages.