question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Add support for multiple webpack magic comments and Prefetch/Preload

See original GitHub issue

First, let me thank you for this awesome tool (alongside react-universal-component and webpack-flush-chunks)

I’ve noticed that #43 was aimed at supporting webpack magic comments which enable thinks like custom chunkNames and lazy mode. And recently, it has been introduced 2 new comments webpackPrefetch and webpackPreload (webpack 4.6.0) that allow you to instruct webpack to use <link rel=”prefetch/preload”> so you can do this as a loading strategy:

universal(() => import(/* webpackChunkName: "route--home", webpackPrefetch: true */"./home"))

but unfortenately the second comment doesn’t work and break the chunkName which results in route--home, webpackPrefetch: true.js. So is there currently any plan to add support these handy features?

Thanks.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:1
  • Comments:5 (1 by maintainers)

github_iconTop GitHub Comments

3reactions
ScriptedAlchemycommented, Oct 1, 2018

This has been added. Install latest and check docs

3reactions
ScriptedAlchemycommented, Jul 19, 2018

This is something I would like to add, the best thing would be to look at the Import visited section at the bottom of the file, I have a function that checks if magic comments exist, it might just need to be updated slightly

Read more comments on GitHub >

github_iconTop Results From Across the Web

<link rel=”prefetch/preload”> in webpack | by Tobias Koppers
I already have a magic comment at import() . Can I add multiple magic comments? Yes, either separated with , or in separate...
Read more >
Code Splitting - webpack
This feature allows you to split your code into various bundles which can then be loaded on demand or in parallel. It can...
Read more >
Webpack 4 course – part eight. Dynamic imports with prefetch ...
With additional arguments that you can pass to webpack by comments, you can customize it even more and add prefetch and preload support....
Read more >
Learn Webpack Prefetch & Preload – Web Performance with ...
Sean examines Webpack's native preload and prefetch support. This ability allows for non-critical assets to be loaded in the background during the browser's ......
Read more >
webpack 5: magic comments not working for images
You have to use the useState hook to trigger the re-render , The webpack prefetching is working fine but react is not re-rendering...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found