I. Introduction to Vue
Vue is a set of progressive frameworks for building user interfaces.
Progressive: You can control one TAB on a page, a series of tabs, the entire page, and even the entire front-end project
Vue’s core library focuses only on the view layer, making it easy to get started and integrate with third-party libraries or existing projects. On the other hand, when combined with modern toolchains and various supporting libraries, Vue is perfectly capable of providing drivers for complex, single-page applications.
2. Vue environment is set up simply
1. Introduced the CDN
<script src="https://cn.vuejs.org/js/vue.js"></script>
2. Local import
Go to the vUE website and download it, put it in your project and import it
Other tools
NPM is the package management tool of Node.js. The construction of vue scaffolding also needs NPM operation. Therefore, it is necessary to understand Node.js before learning VUE
1. Installation node. Js
You can download and install node.js directly from the official website, select the corresponding system version of your computer to install, input node-v and NPM -v if the publication number can be displayed, it indicates that the installation is successful.
2. Vue scaffolding construction
After installing Node, we can use NPM to install VUe-CLI.
npm install vue-cli -g
Because the use of NPM to download things to access the external network needs to turn over the wall speed will be very slow, so we recommend the use of domestic conscience Taobao mirror, that is, CNPM to install.
You can enter the official website of CNPM by yourself, but note that after installing CNPM, you must use CNPM -v to check the version number, otherwise the installation may fail. The use of CNPM is to replace NPM with CNPM.
After the installation of VUE – CLI is the vUE project construction
vue create demo
Create a project
Open the black window –> open CMD –> Use CD to enter the directory to create the project –> enter vue create demo–> Select according to the project requirements:
After all directly press Enter. After the project is created, use NPM run dev/serve(run the project according to the scripts object in package.json) and the following page should appear.