Topic: Are the tutorials still current?
Andrew Davison asked 6 years ago
Hi,
I found your framework while doing a search for MUI Vue integrations, and was very encouraged by the completeness... however when I've gone to start working through your tutorials, they haven't worked...
By downloading the latest boilerplate startup code, I noticed that tags in the tutorials are prefixed with "mdb-", while in the demo code it is not.
e.g. <mdb-navbar-item>.... rather than <navbar-item>. In the environment I've installed using the latest npm package, the second one worked while the first did not.
I'm less inclined to adopt this if the documentation is not current. I'd appreciate any comments you have on this feedback.
Thanks,
Andrew
Jakub Strebeyko staff answered 6 years ago
Hi there, @Andrew Davison,
Thanks for the feedback! So, first thing's first - our documentation has just caught up with what we've been doing prefixing by all the components, freeing up our users' namespace. The prefixed versions are the current ones, and so I must ask - where did you find demo code that would not be mdb-prefixed? It does not seem the case with the just released MDBVue Demo App 4.10.0 or the previous one.
Could you also share some details on the environment you are mentioning? I definitely see the issue with the codesandbox example, where, even after actually importing the components to the file and registering within the vue instance, they stay unregistered UNTIL the prefix is dropped. Firstly, I thought it might be an issue with outdated vue-loader, which does not handle named exports very well, but it was not the case. It is highly unusual -- I also wasn't able to recreate the issue locally, so that's why I'm asking.
I completely get your concern - in these hasty times there is a risk of getting involved with stuff that is half-baked, inconsistent or just broken. I want you to rest assured - it is not the case with MDB, where your problem is our problem. We will get to the bottom of this once we are able to recreate the issue in a controlled environment, that's why all the details regarding the setup are appreciated.
With Best Regards,
Kuba
Dawid Adach pro answered 6 years ago
Dear Andrew,
Thank you for your message - could you please let us know which tutorial exactly are you referring to?
Andrew Davison answered 6 years ago
Hi,
I was using https://mdbootstrap.com/docs/vue/getting-started/quick-start/ and https://mdbootstrap.com/docs/vue/navigation/navbar/#basic-example...
I've attached a screenshot of the rendering when I combine these two.
And here is a codesandbox that demonstrates the problem...
https://codesandbox.io/s/3k0zjrmz5q
Thanks for getting back to me,
Andrew
Andrew Davison answered 6 years ago
I'm installing into an ubuntu 18.04 LTS instance, with node 8.10.0 loaded, and vue 2.9.6.
The codebox sample was built by selecting the latest available vue template (2.5.2), then adding vue-router and mdbvue. Other than that there is nothing special going on - it's all pretty fresh and unadulterated...
Re the demo code, I downloaded MDB-Vue-Free-4.9.0-npm from the direct download link on the "Quick Start" page (https://mdbootstrap.com/docs/vue/getting-started/download/). That was on the 19th, and it seems that you have since changed that... so either I just got unlucky or there was a delay in this file updating as distinct from others...
In general, I would suggest the following for future releases:
1) Adopt the Vue "Breaking Changes" versioning convention, where a move from 4.9 to 4.10 would not indicate breaking changes (in other words, since this one is a breaking change it should be a major version release).
2) Align all your demonstration code (from a versioning perspective) with at least the major revision numbers of the released code... So code that was built with a 2.x.x framework will continue to work if it has a release number that is also 2.x.x
3) When you're making break changes, ensure that the changes to codebase and resources are phase locked... I know this may slow down releases, however thats going to be better than people complaining that the code is inconsistent with the framework...
I still like the look of the framework, and am still considering the pro version based on your responsiveness, however I'll hang until this all gets sorted out.
And do let me know if there is anything I can do to troubleshoot at my end for you...
Cheers,
Andrew
Jakub Strebeyko staff answered 6 years ago
Hey @Andrew Davison,
The codesandbox example really got me thinking - the example is yet to be taken onto a major study of why exactly goes on there - turned into a task for the Vue dev team. Just to make sure - are you experiencing any prefixed components import problems with the newest MDBVue (4.10.0) release locally?
Hey, regarding versioning advice - it struck a chord there. Obviously, changing the minor for breaking changes can get confusing, so I completely agree. The 4 at the beginning of our version stands there to indicate Bootstrap version it uses for positioning et al, but the Vue taste of MDB since then has been developing way faster than Bootstrap. We might have to a adopt an alternative versioning system - all this made me bring the said issue upstairs to have it discussed.
Other than that, we are having quite a focus on the constantly growing documentation, it is our source of pride. Naturally, we delegate time to have it up to date, but in practice it is often the users who come to us with stuff that should be straightened up for everyone's best interests. We wouldn't be here if it wasn't for this awesome community, you see. All thoughts and issues submitted are considered and turned into tasks to have the product where the users want it to be.
So, to sum it up: the codebox example will be studied, and the versioning system suggestions considered.
Huge thumbs up for the input! If I could be asking for anything, it would be to have you post here any other thoughts you might have on MDBVue - may it be problems / issues, but also improvement ideas and all the others.
Best,
Kuba
Andrew Davison answered 6 years ago
Thanks Kuba,
I understand the challenge, especially when you're trying to support multiple frameworks (including Bootstrap). I'd personally run with a seperate versioning line for MDB - alignment of versioning between products has only ever led to bad outcomes (just talk to anyone at Microsoft :) ).
The additional pain comes from some changes causing breaks in MDB versions for different frameworks. In this case I'd go with indicating any bresaking chage as a breaking version. It might be a little confusing when a breaking change for Vue doesn't cause a break in React, but in this case a false positive is a better outcome than a false negative (i.e. not flagging a breaking change).
Hey, I will continue testingn the framework, and as things come up I'll definitely stay in touch. Let me know when you know what's causing the problem, because at the moment the prefixes continue to break my code...
Cheers,
Andrew
Mikołaj Smoleński staff commented 6 years ago
Thank for all Your remarks, Andrew. We'll stay in touch.
Cheers
Andrew Davison answered 6 years ago
Hey folks,
I've just picked up another example (this time SideBarNav from https://mdbootstrap.com/docs/vue/navigation/sidenav/ ) and can't get that to work either.
I've copied it straight from the webpage and dropped it into a codesandbox to see if I was missing something, and nothing gets displayed (just like my native code which I'd adapted from the example).
https://codesandbox.io/embed/w6qyr45rzk
Any further ideas?
Andrew
Andrew Davison answered 6 years ago
Hey folks,
I've just picked up another example (this time SideBarNav from https://mdbootstrap.com/docs/vue/navigation/sidenav/ ) and can't get that to work either.
I've copied it straight from the webpage and dropped it into a codesandbox to see if I was missing something, and nothing gets displayed (just like my native code which I'd adapted from the example).
https://codesandbox.io/embed/w6qyr45rzk
Any further ideas?
Andrew
Jacqueline Romanzyck pro answered 6 years ago
I have noticed a lot of the example and copy-paste codes simply do not work.
https://mdbootstrap.com/docs/vue/css/background-image/
"Background image layout - first option"
The layout doesn't look anything like the sample page. The javascript has typos (missing a ,) and 'mdb-navbar-collapse' does not parse to vue, even though it's correctly included.
Jakub Strebeyko staff answered 6 years ago
Hi there, @Jacqueline Romanzyck,
Huge thanks for reaching out! These issues should be know fixed.
Thanks to you we are able to straighten these inconsistencies. Please don't hesitate to start up a new support ticket in case something is off, we will fix it in no time.
With Best Regards,
Kuba
Andrew Davison answered 6 years ago
Andrew Davison answered 6 years ago
Jakub Strebeyko staff answered 6 years ago
Hi @Andrew,
I am not sure what you are referring to. Could you be a little more specific?
In Jacqueline's case what needed fixing was a docs code snippet. In case of sidenav not working on codesandbox your diagnosis sounds just about right - the npm package does not expose pro components.
Is there anything else I might be of assistance?
Best,
Kuba
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB Vue
- MDB Version: 4.8.2
- Device: surface pro
- Browser: Chrome
- OS: Windows
- Provided sample code: No
- Provided link: No