Anyone here who has an idea how to tackle this problem? I.e. how to get the three .js files (AMD or vanilla) to be included AND executed when rendering view.php?
Thanks in advance!
PS: I can provide the complete code if someone wants to see it. However, the packaging to a .zip file for plugin installation requires manual work right now as I didn't invest to much time into build automation in this early proof of concept work. Just say something if you want me to guide you through the code..
A side note first, regarding your last paragraph: I can very much recommend using git to track your code - in general, but it also helps for dissemination of the code if you want to have someone take a look at it. You can always start with private repositories (or even private git hosters, such as a local Gitlab installation) if you don't want to share right away, and make it publicly available if needed.
Regarding the actual question: I haven't seen any Moodle plugins using Vue via webpack so far. You could have a look at a simple demo created by David Mudrák - I believe it compiles the pages at runtime. Should result in a slight overhead on the clients, but depending on how complex your scripts are that might not even be noticeable. The explanation of his approach is here: https://github.com/mudrd8mz/moodle-tool_vuejsdemo/blob/master/HOWTO.md.
If you want webpack (and I believe that's the preferred approach), have a look at how Nextcloud configures webpack for its plugins. They also have per-plugin configurations of webpack. However, the generated JS file is not an AMD module; it is a plain JS file that you can import via
Please let us know which approach you choose and how it works out - sadly I (still) haven't been able to use Vue.js in any of my Moodle plugins and I am very curious about the results!
thank you so much for your reply!
I do use git (both github and my private gitlab instance) on an everyday basis. No need to convince me.
With your advice I got a basic activity with vue.js running. There are still manual steps involved in deploying as .zip for plugin installation in moodle, but I explained that in the readme of the repo. Happy if you want to take a look yourself
Mainly there were three steps involved:
2. Looks like Vue.js needs to run inside a wrapper, I found this one: https://github.com/vuejs/vue-web-component-wrapper
3. Not yet sure about a better way, but I enabled the `abstract` router mode so that the actual urls in the browser won't be changed during navigation through the app. Maybe it is possible to work with moodle urls, but didn't find a way, yet. Default router replaces too much of the url.
Next issues will be incorporating i18n from moodle and whether or not it is possible to deliver the vue app through the mobile app (I have absolutely no experience on the latter). Then I will try to port one of our quiz game activities to vue.
Anyway, thanks again for your help!