Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

russellxu's avatar

Docker + Mix + Browsersync + InertiaJs

I'm working on a project using InertiaJs. npm watch is fine at most of the time.But soon I realize it cant hot reload the page, I have to press F5 to refresh the page whenever mix is done complie. Then I found Browersync. I followed the instructions , installed Browsersync and rerun npm watch. Browsersync opened a localhost:3000 for me. But I dont think this should work,because my project is running on Docker on port 12800. I'm really confuse about this 3000 port. should I change docker exposed port from 12800 to 3000? Here is my docker yml file and webpack.mix.js file:

  enwei_sys:
    build:
      context: ./dockerfile
      dockerfile: php8public
    tty: true
    container_name: enwei_sys
    ports:
      - "12800:80"
    volumes:
      - ../work/enwei_inertia:/var/www/html
      - ./php/php.ini:/user/local/etc/php/conf.d/php.ini  
mix.js('resources/js/app.js', 'public/js')
    .vue()
    .sass('resources/scss/app.scss', 'public/css', {
        additionalData: `@import "./resources/scss/_variables.scss";`
    })
    .webpackConfig({
        resolve: {
            alias: {
                '@': path.resolve('resources/js'),
                'SassVariables': path.resolve('resources/scss/_variables.scss')
            }
        },
    })
    .browserSync();
0 likes
1 reply
russellxu's avatar
russellxu
OP
Best Answer
Level 23

I found out I can simply add mix option like below in my webpack.mix.js file and run npm run hot outside docker

mix.options({
    hmrOptions: {
        host: 'localhost',
        port: 888
    }
})

so, based on this, I can start up a node container and run npm run hot in it , sperate from server-side container.

Please or to participate in this conversation.