Improve the documentation

[y377]

Prerequisites

• I have searched for duplicate or closed feature requests
• I have read the contributing guidelines

Proposal

Thanks for the "patch"

Improve the documentation, such as loading only CSS, or self-compiling SCSS, which JS libraries do I need to load?
Split the use method, let the user choose more flexible loading method, such as I need to download JS and CSS/SCSS to the local, how to load?

Motivation and context

For example, how do I download these JS documents individually and run them locally?

Semantic error, this: <link rel="stylesheet" href="/css/bootstrap-ie11.min.css">The following line of code is not usable

<script nomodule>
window.MSInputMethodContext && document.documentMode && document.write('<link rel="stylesheet" href="/css/bootstrap-ie11.min.css"><script src="https://cdn.jsdelivr.net/combine/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js,npm/ie11-custom-properties@4,npm/element-qsa-scope@1"><\/script><script crossorigin="anonymous" src="https://polyfill.io/v3/polyfill.min.js?features=default%2CNumber.parseInt%2CNumber.parseFloat%2CArray.prototype.find%2CArray.prototype.includes"><\/script>');
</script>

repair：

<script nomodule>
window.MSInputMethodContext && document.documentMode && document.write('<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-ie11@5.2.3/css/bootstrap-ie11.min.css"><script src="https://cdn.jsdelivr.net/combine/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js,npm/ie11-custom-properties@4,npm/element-qsa-scope@1"><\/script><script crossorigin="anonymous" src="https://polyfill.io/v3/polyfill.min.js?features=default%2CNumber.parseInt%2CNumber.parseFloat%2CArray.prototype.find%2CArray.prototype.includes"><\/script>');
</script>

or better

    <!-- required JavaScript polyfills for IE11 -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-ie11@5.2.3/css/bootstrap-ie11.min.css">
    <script nomodule crossorigin="anonymous" src="https://polyfill.io/v3/polyfill.min.js?features=default%2CNumber.parseInt%2CNumber.parseFloat%2CArray.prototype.find%2CArray.prototype.includes">
    </script>
    <script nomodule>
        window.MSInputMethodContext && document.documentMode && document.write('<script src="https://cdn.jsdelivr.net/combine/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js,npm/ie11-custom-properties@4,npm/element-qsa-scope@1"><\/script>');
    </script>

[coliff]

Thanks for the good suggestions. I agree we can make it clearer and easier to follow. I'll work on this for the next update.

[y377]

I would like to ask how to split it. This domain name has a high access delay for users in mainland China. Is there any way to get the JS code locally? Thank you.

https://polyfill.io/v3/polyfill.min.js

<script nomodule>
window.MSInputMethodContext && document.documentMode && document.write('<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-ie11@5.2.3/css/bootstrap-ie11.min.css"><script src="https://cdn.jsdelivr.net/combine/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js,npm/ie11-custom-properties@4,npm/element-qsa-scope@1"><\/script><script crossorigin="anonymous" src="https://polyfill.io/v3/polyfill.min.js?features=default%2CNumber.parseInt%2CNumber.parseFloat%2CArray.prototype.find%2CArray.prototype.includes"><\/script>');
</script>

This will cause the navigation bar drop-down menu to fail. The following will not

 <script nomodule crossorigin="anonymous" src="https://polyfill.io/v3/polyfill.min.js?features=default%2CNumber.parseInt%2CNumber.parseFloat%2CArray.prototype.find%2CArray.prototype.includes">
    </script>
    <script nomodule>
        window.MSInputMethodContext && document.documentMode && document.write('<script src="https://cdn.jsdelivr.net/combine/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js,npm/ie11-custom-properties@4,npm/element-qsa-scope@1"><\/script>');
    </script>

china user:
try:

    <script nomodule crossorigin="anonymous" src="https://polyfill.alicdn.com/polyfill.min.js?features=default%2CNumber.parseInt%2CNumber.parseFloat%2CArray.prototype.find%2CArray.prototype.includes">
    </script>
    <script nomodule>
        window.MSInputMethodContext && document.documentMode && document.write('<script src="https://cdn.staticfile.org/bootstrap/5.0.0-beta2/js/bootstrap.bundle.min.js"><\/script><script src="/assets/js/ie11_need.js"><\/script>');
    </script>

[coliff]

@y377
I was looking at this issue: polyfillpolyfill/polyfill-service#2638 regarding polyfill.io being blocked in Malaysia. An alternative domain name was set up - https://polyfills.io/v3/polyfill.min.js (polyfills.io instead of poylfill.io) - can you please try that? If it works then I may suggest that as an alternative.

[y377]

@coliff
Thank you for your reply, but the ping delay is very high, which will affect users' access to the website.
If I find a better solution later, I will update again

I think it is the best way if the required JS code can be packaged separately and made into offline files.