Vue.js | Introduction & Installation - GeeksforGeeks

20 Oct, 2020
VueJS is one of the best frameworks for JavaScript like ReactJS. The VueJS is used to design the user interface layer, it is easy to pick up for any developers. It is compatible with other libraries and extensions as well. If you want to create a single page application then VueJS is the first choice in my opinion. In the development field, there may be so many issues that can not be solved by using a single library, so the VueJS is compatible with other libraries so you can easily go for it. The VueJS is supported by all popular browsers like Chrome, Firefox, IE, Safari, etc. You can easily compare this library with your favorite libraries.
Difference between ReactJS and Vue.js
Difference between VueJS and AngularJS
Installation of VueJS: The VueJs can be used in three different ways those are listed below:
Directly included CDN file.
Install through the npm.
By CLI use VueJS
Directly include CDN file: You need to download the VueJS Development Version and Production Version then include it in the script tag.CDN:
For learning purpose, you can use below script(with the specific version):<script src=”https://cdn.jsdelivr.net/npm/vue/dist/vue.js”></script>For production purpose, you can use below script:<script src=”https://cdn.jsdelivr.net/npm/vue@2.6.11′′></script>For ES modules compatible, use below script:<script type=”module”>import Vue from ‘https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.esm.browser.js'</script>
For learning purpose, you can use below script(with the specific version):<script src=”https://cdn.jsdelivr.net/npm/vue/dist/vue.js”></script>
<script src=”https://cdn.jsdelivr.net/npm/vue/dist/vue.js”></script>
For production purpose, you can use below script:<script src=”https://cdn.jsdelivr.net/npm/vue@2.6.11′′></script>
<script src=”https://cdn.jsdelivr.net/npm/vue@2.6.11′′></script>
For ES modules compatible, use below script:<script type=”module”>import Vue from ‘https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.esm.browser.js'</script>
<script type=”module”>import Vue from ‘https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.esm.browser.js'</script>
Install through the npm: Before applying this procedure you must have installed npm, to check npm installed or not run the below command:
npm -v
If not, you can install that through node.js installation procedure for:
Installation of Node.js on WindowsInstallation of Node.js on Linux
Installation of Node.js on Windows
Installation of Node.js on Linux
Now you are ready to install the VueJS, to do so run the below command. It will install the most updated stable version of VueJS.
npm install vue
By CLI use VueJS: Open your terminal or command prompt and run the below command.
npm install --global vue-cli
Let’s create a project through webpack:
Step 1: Run the below command to create the project.
vue init webpack myproject

Step 2: Now get into the myproject folder by using below command.
cd myproject

Step 3: Run the below command to run locally your project.
npm run dev

bunnyram19
Vue.JS
JavaScript
Web Technologies
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Comments
Old Comments
Convert a string to an integer in JavaScript
Set the value of an input field in JavaScript
Differences between Functional Components and Class Components in React
How to Open URL in New Tab using JavaScript ?
Form validation using HTML and JavaScript
Express.js express.Router() Function
Convert a string to an integer in JavaScript
How to set the default value for an HTML <select> element ?
Top 10 Angular Libraries For Web Developers
How to create footer to stay at the bottom of a Web page?