Laravel-mix: run hot the server root path isn't public ?

[cmzz]

npm run hot.

Request http://127.0.0.1:8080/css/app.css got 404 error.

If I mv public/css/app.css to Laravel project root path, then request http://127.0.0.1:8080/app.css is successful.

Have any params to set the root path ?

  "hot": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",

[m1so]

You have to set the webpack dev server base path in webpack.config.js

module.exports.devServer = {
    ...
    contentBase: path.join(__dirname, "public"),
    ...
};

Note that I run npm run hmr from the project root directory and webpack dev server v2.3.0.

[ankurk91]

Finally i was able to make this - (v1.2.0)
Just add these to your webpack.mix.js

// version does not work in hmr mode
if (process.env.npm_lifecycle_event !== 'hot') {
  mix.version()
}
const path = require('path');
// fix css files 404 issue
mix.webpackConfig({
  devServer: {
    contentBase: path.resolve(__dirname, 'public'),
  }
});

Run command npm run hot, wait for build
Access your virtual host as normal, for example http://laravel-app.dev
Do NOT try to access http://localhost:8080 (this is where most people get confused)
Any change made in ./resources/assets folder files should reflect on virtual host domain.
Make sure you're using mix() blade helper to load assets.

@JeffreyWay
The docs should be updated to reflect this.

[pix2D]

@ankurk91 Holy batman, the contentBase is what finally made this work for me. Thanks so much.

[nelson6e65]

I'm using v2.0.0, and maybe this is related and may be useful to someone...

The @ankurk91 solution did not work for me.

I had to set output.publicPath to / or '//localhost:8080/', depending on mix.config.hmr:

mix.webpackConfig({
  output: {
    chunkFilename: 'assets/js/[name].js',
    publicPath: mix.config.hmr ? '//localhost:8080/' : '/'
  }
})

Notice the ending '/' in '//localhost:8080/'; using just _'//localhost:8080'_ give me some problems to load some components

[ankurk91]

@nelson6e65
Laravel mix is already doing the same

https://github.com/JeffreyWay/laravel-mix/blob/9fbd97915bfab2027dfb8f80ceac484915f5c88d/src/builder/WebpackConfig.js#L66-L73

[nelson6e65]

@ankurk91 Laravel mix is already doing the same

For some reason, I had to be explicit.

Because before, didn't work on dev or production, only hot (I figured out when I used production :sweat_smile:). Then, I have to explicitly set this property.

Let me check my version.

[nelson6e65]

Let me check my version.

Yes, in v2.0 is set to '' when not hmr. That's why I was having the relative path on production instead of /, like in v2.1.

Thanks for your answer, @ankurk91. I will upgrade :sweat_smile: