+ 3

What does exports.default=_default means?

Here is the js file which has the above line at the end ,I want to know what is it doing ? And how would I import Button component from it on sololearn ? If I can't then why is it hosted on cloudfare? https://cdnjs.cloudflare.com/ajax/libs/material-ui/4.11.0/Button/Button.min.js

21st Sep 2020, 6:29 PM
Abhay
Abhay - avatar
8 odpowiedzi
+ 5
Abhay It appears this file uses the require() function which indicates it's for use with NodeJS. I'm not really familiar with this script.
22nd Sep 2020, 1:53 AM
David Carroll
David Carroll - avatar
+ 3
If you look just above that last line, you'll notice the line below: ---- var _default= (0, _withStyles.default) (styles, {name:"MuiButton"}) (Button); exports.default=_default; ---- I'm assuming this is just an IIFE that might be the equivalent to the following: ---- var createButton = _withStyles .default( styles, {name:"MuiButton"} ) exports.default = createButton(Button) ----
21st Sep 2020, 9:24 PM
David Carroll
David Carroll - avatar
+ 2
David Carroll can you help please? Using cdn material-ui/core/@latest/production.min.js allows using Button component in sololearn by const {Button} =MaterialUI , but if I am not wrong it is loading all the components from material-ui package but I want to use only Button so I searched for the above cdn but how would I get Button component from it to use in sololearn ?
21st Sep 2020, 9:05 PM
Abhay
Abhay - avatar
+ 1
David Carroll Thank you ! Also i have this code setup but how can I use Button component? I still don't have an idea about it , https://code.sololearn.com/WDCVotd7ZfAi/?ref=app Something called Button is available in window object but using it directly gives an error which I am not able to understand at all
21st Sep 2020, 11:35 PM
Abhay
Abhay - avatar
+ 1
Your version relies on Node and npm to work. If you look at the unminified version https://cdnjs.cloudflare.com/ajax/libs/material-ui/4.11.0/Button/Button.js You will notice many require calls instead of ES 6 imports If you want to use Material UI in Sololearn use the UMD(Universal module definition). It will import all the required components to the window object. Development https://unpkg.com/@material-ui/core@latest/umd/material-ui.development.js Production https://unpkg.com/@material-ui/core@latest/umd/material-ui.production.min.js Documentation https://material-ui.com/getting-started/installation/
22nd Sep 2020, 6:30 AM
Ore
Ore - avatar
+ 1
Ore Ty !,I was using umd only and seems like there is no other way than to use it again , Also i am familiar that require is used in node environment but works fine for cdn included at client side browsers ,if not I don't get the purpose of having a cdn for component hosted on cloudfare , And this cdn works fine even tho it makes require calls https://cdnjs.cloudflare.com/ajax/libs/react-redux/7.2.0/react-redux.min.js Button is similar like this ,require shudn't be a problem if I include the files that it requires ,the problem is how would I include Button component from it and what Does the error mean? Button is available in window object but simply using it without importing doesn't works
22nd Sep 2020, 6:49 AM
Abhay
Abhay - avatar
+ 1
Abhay I searched the entire file and cannot find any require calls. Except this, at the beginning of the file, function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('redux'), require('react-dom')) : (...) I am not sure but I think the require function has been overloaded by a bundler. This might happen if you transpile your js code with browserify or similar tools. I will be waiting for David Carroll to answer that though.
22nd Sep 2020, 7:11 AM
Ore
Ore - avatar
0
Ore I just saw those require functions and thought it is the same like that one ,both button and redux react files names looked same to me ,so I thought I had mentioned why react redux works (only after including cdn for react ,react dom and redux before) and button .js won't work similarly but seems like their is lot of difference in both ,btw new to all this and don't even understand what is a bundler or so terms ,ty tho , some new things to explore for me , still I can't understand the reason behind having a cdn for button js sperately if you can't use it just ,
23rd Sep 2020, 1:28 PM
Abhay
Abhay - avatar