Implement a static Vue app and deploy it on Azure using CI/CD. Part 1, Continuous Integration
While I have some extra free time because of the Corona virus outbreak, I decided to experiment with Vue and build a small static HTML Hello-World application for getting to know the framework better. The website contains no backend code.
The article focuses on how to automate the Build and Deploy process of our small application. I will try to clarify the steps needed till our static website is visible through an Azure URL.
In this article I will skip the Vue logic of my app and focus solely on the DevOps tasks that have to be made in Azure DevOps. Our static website will then be deployed on an Azure Storage Container. The article focuses on Windows users.
Most of us use private feeds in NuGet for storing our NuGet Packages. However, some projects might have stricter security restrictions that others, making it necessary to disable certain feeds to avoid using them as references.
To “blacklist” feeds, you can use the following configuration:
How to solve the "Property or method XXX is not defined on the instance but referenced during render" in Vue.js
One common error during my first steps with Vue was the following, that is logged in the console of your browser:
*vue.js:634 [Vue warn]: Property or method “XXX” is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See the documentation for declaring reactive properties.