Laravel Spark 3 and Vue components
It took me 3 hours to update my whole Spark application to the new version.
Spark 3 and Vueify
If you’re not familiar with Vueify yet, check out my article Laravel Spark - Vue components where I cover some basics.
If you have used Vueify with Spark before, you will notice that using Vue components is the same.
1. Create a Vue component
This is our Vue component containing the template, script and the styles.
2. Import the component
Next we need to import the component and add it to our Vue instance. This is done within the
app.js file. The whole
file looks like this:
Only the two lines highlighted were added here.
3. Include the component in a template
For our demo I will put this component inside the Spark login page.
4. Gulp it
No we just need to run Gulp in order to compile the assets again. If you visit your login page you should see our
Hello World like this:
As you could see the harder part is updating your Vue.js components to the new version. Using .vue components is very straight forward again because Laravel is helping us a lot under the hood. Let me know if you ran into other problems.