mariusbalcytis / webpack-bundle

Bundle to Integrate Webpack into Symfony
MIT License
122 stars 36 forks source link

HMR with {% webpack css %} #63

Closed vini-btc closed 7 years ago

vini-btc commented 7 years ago

Would it be possible to make HMR work with assets inserted into templates with the {% webpack css 'path/to/less/file.less' %}? If so, could you point me out how to do it?

Thank you once again!

mariusbalcytis commented 7 years ago

Well, I did not test it just know, but as far as I know, it should work just fine.

Are you using app/console maba:webpack:dev-server? As HMR only works with dev-server.

Are you changing something inside file.less and it does not reload in browser, or do you change some other things?

vini-btc commented 7 years ago

I'm changing file.less. Everything works almost fine. The bundle is updated and the page even reloads, but this is not actually hot module reloading. But I took a bit deeper look and it looks like something you have to setup within webpack. Not all loaders have the module replacement feature enabled. For now I'm staying with it as it is but later I'll see if it is possible to come up with any type of workaround. If I do that, I'll make sure I share the solution here.

Once again, thank you.

mariusbalcytis commented 7 years ago

Basically, to get HMR working, extract-text-webpack-plugin is not needed in development.

You would get a flash of styles, though, as styles are loaded by JavaScript.

Also, you cannot use css/less files directly as an entry point, if not using that plugin.

You cpuld just configure extract_css: false in your webpack parameters in config_dev.yml.

Of course, not the nicest solution... But in any case, for HMR to work, some JavaScript is still needed. And if you use css directly as an entry point, in theory you include none script tags at all. So this could get quite complicated to set-up correctly.

vini-btc commented 7 years ago

It was what I thought. But the way it is, with live-reloading is still good enough. Thank you.