Topic: Performance and CDN
I am curious to know is it not better to load fontawesome and roboto font from CDN?
I can understand for development purposes, but is there documentation on using the CDN for these?
Am I missing something or not understanding why it is done in this current way?
import '@fortawesome/fontawesome-free/css/all.min.css'; import 'bootstrap-css-only/css/bootstrap.min.css'; import 'mdbreact/dist/css/mdb.css';
Yes, sure, it's not a problem, you can freely use cdn to load those stylesheets. We recommend importing these files from node_modules because we can adjust which version you are downloading, and make sure beforehand, that there are compatible.
okay so I did the following, please advise if it goes against anything that MDB does not recommend. I am using CRA.
Add the following to the index (head).html
<!-- FontAwesome 5.8.1 --> <script defer src="https://use.fontawesome.com/releases/v5.8.1/js/all.js" integrity="sha384-g5uSoOSBd7KkhAMlnQILrecXvzst9TdC09/VM+pjDTCM+1il8RHz5fKANTFFb+gQ" crossorigin="anonymous"></script> <!-- Bootstrap CSS Only --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
- Commented out these 2 lines
// import '@fortawesome/fontawesome-free/css/all.min.css'; // import 'bootstrap-css-only/css/bootstrap.min.css';
Also, is there no way to use Roboto fonts via CDN instead of via DIST copies ? What is the best way to do this without "upsetting" MDB installation?
Are there any negatives to this approach?
Yes, sure, if you want to customize our stylesheets, the best way is to switch to using scss, just install
yarn add -D node-sass
and follow the instructions provided here. https://mdbootstrap.com/docs/react/css/colors/#scss
Then, to get rid of Roboto font, comment out or remove the scss import of typography module in the
'scss/mdb.scss'. You can also remove the entire font directory.
// @import "core/typography";