Does the Vue Pro version allow me to select individual modul


Topic: Does the Vue Pro version allow me to select individual modules?

moofly asked a year ago

I'm super impressed with mdboostrap, and I'm seriously considering using the Pro version with products going forward.

One thing that would concern me is the size of the vue bundle even after webpack has done its treeshaking. I notice that the free version includes 'chartjs' and 'moment', neither of which I would use. Is there a way to remove them from the final build if I were to buy Pro? They take up nearly half of the bundle.

Simply importing the css in main.js and then adding the following code in one of my components means chartjs and 'moment' are included in the final build:

import { mdbInput, mdbBtn }  from 'mdbvue';

Any ideas? I'd really like to buy your product.


Magdalena Dembna staff premium answered a year ago

Unfortunately, the answer is no. However, we are currently discussing optimizing our package's size. Besides, the upcoming Vue version is supposed to introduce major changes in that area, so I hope that in the future we will be able to reduce our package's size. Kind regards, Magdalena


moofly answered a year ago

Ok no worries. I've bought the product and I'll see if I can use webpack's 'resolve' to remove it, or failing that, I'll remove it manually.

Update: For anyone looking to slim down mdbootstrap then I found the best method was to modify my vue.config.js and add something similar to the module.export - obviously only remove stuff that isn't used in any components that you need.

configureWebpack: {
    externals: {
        'popper.js': {
            root: 'PopperJS',
            commonjs2: 'popper.js',
            commonjs: 'popper.js',
            amd: 'popper.js',
          },
        'moment': 'moment',
        'chart.js': 'chart.js',
    }
}

I also commented out cards, chat, date pickers and tooltips from mdbvue's index.js too. This got my vendor.js bundle down to 106KB gzipped, and my entire js payload including my app itself under the 130KB magic number.


Magdalena Dembna staff premium commented a year ago

If you're interested you can follow changes in our package here: https://mdbootstrap.com/docs/vue/changelog/ or subscribe to a newsletter. As soon as something changes in this area, we will include it in the changelog.


Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: Vue
  • MDB Version: 5.6.0
  • Device: Development
  • Browser: N/A
  • OS: Vue CLI / Webpack
  • Provided sample code: No
  • Provided link: No