numical / script-ext-html-webpack-plugin

Enhances html-webpack-plugin functionality with different deployment options for your scripts including 'async', 'preload', 'prefetch', 'defer', 'module', custom attributes, and inlining.
MIT License
588 stars 105 forks source link

Both defer and async #32

Closed aseem2625 closed 7 years ago

aseem2625 commented 7 years ago

I tried providing same array file names to async and defer but defer is not getting added as said in README.md regarding defer will be added only when it doesn't meet 1,2,3 conditions. Is it possible to add both these attributes at the same time. It would be really useful!

In short,

    new ScriptExtHTML({
    async: ['manifest', 'vendor', 'app'], // swapping order with below defer also doesn't work
    defer: ['manifest', 'vendor', 'app']
}),

defer attribute isn't added

I don't want my files to be requested for downloading after document is loaded. Yet I want my files to execute in the same order as manifest->vendor->app for which defer and async together is the only choice I've

Thanks 🙂

numical commented 7 years ago

Hmm - I suspect that whatever is working for you is a browser-specific feature. As best I see, according to the w3 specs the presence async overrides defer behaviour:

There are three possible modes that can be selected using these attributes. If the async attribute is present, then the script will be executed asynchronously, as soon as it is available. If the async attribute is not present but the defer attribute is present, then the script is executed when the page has finished parsing. If neither attribute is present, then the script is fetched and executed immediately, before the user agent continues parsing the page.

So, sorry, I will not be adding this feature.

aseem2625 commented 7 years ago

No prob. I think using defer is best approach in my case as its SSR