Vue JS
Permalink
I'm looking to integrate Vue.js with C5. Can't find much about it. Does anyone run something similar?
We have used Vue JS for both a front-end block and a dashboard page. Do you have specific questions?
What is the best way to integrate it? Just bring in the min files into your build and make files a components folder? How did you make a block from it? Are you using vue js with single pages or widgets using components?
You may still need to be more specific as to what you are building, whether it's a block, a theme, etc.
But generally speaking it's best to add extra libraries such as vuejs through the 'Assets' system.
You register an asset in a package, doco here:
https://documentation.concrete5.org/developers/assets/registering-an...
and then later on where you actually want to start using that script you 'require' the asset:
https://documentation.concrete5.org/developers/assets/requiring-an-a...
By handling it this way, concrete5 automatically outputs the script at the right time, and you don't to think about manually adding in script tags to templates.
I actually did this with vuejs last week when building a new Attribute Type, and the asset system worked great to pull the vuejs library in when required.
But generally speaking it's best to add extra libraries such as vuejs through the 'Assets' system.
You register an asset in a package, doco here:
https://documentation.concrete5.org/developers/assets/registering-an...
and then later on where you actually want to start using that script you 'require' the asset:
https://documentation.concrete5.org/developers/assets/requiring-an-a...
By handling it this way, concrete5 automatically outputs the script at the right time, and you don't to think about manually adding in script tags to templates.
I actually did this with vuejs last week when building a new Attribute Type, and the asset system worked great to pull the vuejs library in when required.
Thanks for this. How do you build your components and then inject them into the page.?
Do you add a HTML code block and drop the code into there? Also have you found the need to use Express with vue js?
Do you add a HTML code block and drop the code into there? Also have you found the need to use Express with vue js?
In concrete5 you generally build components to place and move around pages as 'blocks':
https://documentation.concrete5.org/developers/working-with-blocks/c...
You would create your block and add to a package, and in that package you could add vuejs as an asset, to allow the block to use it.
HTML blocks are really only use for ad-hoc placement of small bits of HTML (such as HTML that you don't want mangled by the Content block), and aren't for more advanced functionality that might require PHP.
Express isn't really related to this, that's more of a system within concrete5 to quickly build up forms and related data, you don't need to use it.
Going back a step, it's probably a good idea to explain more broadly as to what you are wanting to build and what problem you are trying to solve. Without this explanation, we're only just guessing!
https://documentation.concrete5.org/developers/working-with-blocks/c...
You would create your block and add to a package, and in that package you could add vuejs as an asset, to allow the block to use it.
HTML blocks are really only use for ad-hoc placement of small bits of HTML (such as HTML that you don't want mangled by the Content block), and aren't for more advanced functionality that might require PHP.
Express isn't really related to this, that's more of a system within concrete5 to quickly build up forms and related data, you don't need to use it.
Going back a step, it's probably a good idea to explain more broadly as to what you are wanting to build and what problem you are trying to solve. Without this explanation, we're only just guessing!
