Installing VueJS

Installing Vue

Methods of integrating VueJS into an application

Adding VueJS to a project is about as simple as it gets in the JavaScript world. We will go over 3 ways to do so.

  • CDN script include
  • NPM
  • Frameworks

CDN Script

Here is an example

The easiest way to get started with VueJS is to simply include the script tag in your index.html file. By simply pasting the following snippet near the end of your html code, your website or application can use the VueJS API

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.js"></script>
VueJS CDN script

NPM Package Manager Method

The VueJS docs recommend using the NPM package manager to install and setup VueJS. You will of course need NPM and Node installed and running on your development environment, as well as eventually your deployment environment .

Need help installing NPM or Node? Click here

Open up a terminal/command line, and using the NPM command line interface, install VueJS

$ npm install vue

With that simple command, VueJS will be installed and the VueCLI can also be used to initialize a project.

Frameworks

Another easy way to get started is to use a framework that has VueJS pre-installed and configured.

Nuxt JS

A great option for a fully fledged front end application is Nuxt.js. This framework’s goal is to offer an environment flexible enough to use as an entire project, or to add into an existing project. Nuxt also offers server rendering which is great for SEO

Laravel

Taylor Otwell, the founder of the Laravel PHP framework, includes VueJS by default in the Laravel framework. While it’s not necessary to use, Starting your project with Laravel and Vue will streamline your development of dynamic frontend applications and flows. The Laravel docs offer a quick start example component to get started with Vue and Laravel.

There are certainly many other ways to get started or to integrate VueJS into your application. Do you have any tips or tricks you’d like to share. Let us know in the comments


If you found this helpful, or just want to help us out, feel free to donate as little or as much as you’d like. Every little bit goes towards helping caffeine addicts in need.

Leave a Reply

Your email address will not be published. Required fields are marked *