all components pushed in single index.js. The question

web
mobile

Topic: all components pushed in single index.js. The question

xdon82 pro premium asked 2 weeks ago

Since MDBvue is no more available as dev version (no vue files), I noticed that all components are read from main index.js in mdbvue folder (in node_modules) My question is, Is whole that code loaded to memory, despite I chose which components I want to use?

If it is, then there is too much code to load. That would make it badly optimised.

How it works?


Mikołaj Smoleński staff answered 2 weeks ago

To reduce memory size we strongly recommend to use tree-shaking mode while importing components:

https://mdbootstrap.com/docs/vue/getting-started/quick-start/#tree-shaking

Best regards


xdon82 pro premium commented a week ago

Of course I use tree-shaking, but are you sure the whole index.js is not loaded anyway?


Mikołaj Smoleński staff commented a week ago

If you're not importing anything from mdbvue then yes. Best


xdon82 pro premium commented a week ago

but mdbvue is imported from 'mdbvue/lib/components'. However anyway I need just always to point particular component , right?

From doc:Basic example:

import { mdbContainer, mdbRow, mdbBtn } from 'mdbvue'

Tree shaking example:

import mdbContainer from 'mdbvue/lib/components/mdbContainer'import mdbRow from 'mdbvue/lib/components/mdbRow'import mdbBtn from 'mdbvue/lib/components/mdbBtn'

BTW I hope Vue files will be available soon again. I see always very little errors, especially since I use Eslint, and it's much easier to correct them (actually the only main one is in mdbSideNav - that "update..." thing I've already mentioned in other posts). + I see better how to use a component in better way. Not everything is well explained in doc.

Only this will allow me to stick with your framework to use it in simpler projects. I see it quite interesting and I would not like to drop it. For more advanced projects I use Quasar. They have very good doc - consider to make similar one for mdbvue in future. Much more readable and clear.


Mikołaj Smoleński staff commented a week ago

mdbvue is not imported from mdbvue/lib/components, but from index.js file in the root. To use tree shaking you need to import each component separately. Also, the source code will be available again from the next release.

Best regards


Mikołaj Smoleński staff commented a week ago

mdbvue is not imported from mdbvue/lib/components, but from index.js file in the root. To use tree shaking you need to import each component separately. Also, the source code will be available again from the next release.

Best regards


Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: Vue
  • MDB Version: 6.1.0
  • Device: pc
  • Browser: Edge Chromium
  • OS: win10
  • Provided sample code: No
  • Provided link: No
Tags
vue