How does the namespace of objects gets defined onto the 'window' object e.g. external dependencies via element?
I am using external dependencies distributed through CDN via the element. I don't know what name to use to reference some of these dependencies so I console.log the window object to find it. What is happening behind the scene to cause it to name the React dependency as 'React', react-Dom as 'ReactDOM', or Babel as 'Babel'?
I also noticed that some of the packages from the CDN's had 'import' statements such as redux-toolkit which has import from 'immer', 'reselect', 'redux', 'redux-thunk' and export statements that 'export * from "redux" and exports it's own functions. Does this implies that there is some universal accepted naming convention for these libraries on the global scope? How can I find out what a CDN dependency via element is going to be named?
<!-- Babel (window.Babel) -->
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<!-- react (window.React) -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/18.2.0/umd/react.production.min.js"></script>
<!-- react-DOM (window.ReactDOM) -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/18.2.0/umd/react-dom.production.min.js"></script>
<!-- redux (window.Redux) -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/redux/4.2.1/redux.js"></script>
<!-- redux-toolkit (couldn't get it to show on window object) -->
<script src="https://cdn.jsdelivr.net/npm/@reduxjs/[email protected]/dist/redux-toolkit.legacy-esm.min.js"></script>
<!-- redux-thunk (couldn't get it to show on window object) -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/redux-thunk/3.1.0/redux-thunk.legacy-esm.js"></script>
console.log(window):
{
Babel: {…}
React: {…}
ReactDOM: {…}
Redux: {…}
_RTK: undefined
_React: {…}
_ReactRedux: undefined
}
I have tried CDN sources and various versions to get all the dependencies to load properly on the project. I also downloaded each of the dependencies and searched through the code to see if there were code defining the namespace but did not find any. I would like to understand what determine how the namespace for that particular dependency gets named on the window object and how it goes about doing so.