Hallo there!
As I am currently working to improve my Podcaster plugin I’m failing hard and waste a lot of time. Writing a plugin to provide blueprints, routes or api endpoints is quite nice to do. Searching the docs or the forum helps most of the time.
I am now trying to add things to panel, showing download stats of episodes for example. This cannot be done with a simple blueprint, so I am trying to use my api endpoints, creating some charts, writing my own section type. And I am failing hard because there is only a very basic documentation.
I am not familiar with vuejs (I am currently working with react), but I want to structure my code to keep maintainable. I don’t want to put everything into the index.js file and I think most plugin developers would like to avoid this, if the plugin has a certain size.
So without any knowledge about vue and no documentation on that topic (or I did’nt find it) I am wasting a lot of time getting things working, getting up a watcher for development, getting the things built into index.js, picking packages I need …
It would be so nice to have some docs on that topics. Or even a boilerplate for a simple package.json allowing developers to import vue files and compile stuff. I tried to look into other plugins how it’s done there but all that takes a lot of time which I prefere to invest in doing “real” developing work.
I think there might be more plugins and more advanced plugins if there were a more detailed documentation on that topics.
Maybe someone here can provide me with some links/docs on how to get things set up more quickly, that would be highly appreciated. But it would be good to be able to find things like that in the docs.
I understand how you feel, I was lucky to have some prior knowledge of vue, yet the journey to my first plugin wasn’t a piece of cake.
The team already started to unify things with the Pluginkit, the readme also states that there’s a panel plugin kit in the making.
I gathered some unofficial stuff from slack / discussions that might help you here, most of which are still valid.
My plugin use this browserify build process that @rasteiner came up with, however he seems to have come up with a smoother webpack setup judging from this trevor plugin (are you satified with this?).
I had this idea of making an extended cookbook recipe, documenting the whole development of a plugin from start to finish (thought of a table plugin or a calendar view in the panel, @bnomei is it something that’d be useful for your plugin or are you already planning a panel section with your calendar plugin?) but that’d take quite a lot of time…
I actually thought about taking apart an existing plugin to document the process as well, downside is that I’m not very familiar with Vue or creating Panel plugins yet, so that will also still take time. So sorry for the docs being so poor on that.
Apart from the Kirby part of building it, the build process is another thing, as different people seem to take different approaches, so for the documentation, we’d have to concentrate on one.
i have not started on a calendar plugin yet. i will PM you if i get my clients OK so we do not waste time.
my janitor plugin (just a simple field) is based on the community docs @sylvainjule is referring to. i got a lot of help from @rbnschlz back then. maybe it can help you getting the setup started as well.
@sylvainjule
I’ve switched from browserify to webpack because “vueify” (the browserify transform that added support for .vue files) has been deprecated by the Vue team.
I wouldn’t say the webpack is “smoother”: as I had to replace 2 lines of bash with 54 lines of javascript and hot module reloading doesn’t really work anymore.
I guess if there is no more documentation about this (the build step), it’s also because there doesn’t seem to be a perfect solution at the moment.
@distantnative is probably closest, he uses bili which outputs a working build with a cleaner config. In his retour plugin bili wraps the whole file into a UMD header which is useless to Kirby - maybe that could be switched to an IIFE build…
Thank you for all your replies 
This seems to be a tricky topic…
I will have a look at it, maybe that will help.
I grabbed the first plugin I found in my plugins folder using vue and that’s the matomo plugin, which may not be the best one to get started, because it’s doing a lot of stuff.
Isn’t there a build-system set up for the panel? Wouldn’t that be a good starting point for a boilerplate? I think it would be a nice thing if plugin developers all use the same base, so it will be easier to help each other. But I understand that everybody has own preferences.
You can change the bili output format to iife without any problem: https://bili.egoist.sh/api/globals.html#format [the -min part toggles the minification on]