Vue full version and Runtime version

Full version: Contains both compiler and runtime versions. Runtime: No compiler

Start with the VUE example

Q: How do I use vue instances? There are three ways to use a VUE instance.

Method 1: Get the view from the HTML

This method is what the documentation saysThe full version vue, can be done by referring to vue.js or vue.min.js through bootCDN.

Since the vue project we created uses the Runtime version by default and has no compiler, we write the data directly in HTML without rendering it.

The code for index.html is as follows:

Rewrite main.js as follows:

Render result: n is not rendered, but the following error is reported:

The solution is to introduce the full vue in index. HTML:

Data rendering succeeded.

Approach 2: Build the view with JS

This method is actually the Runtime version, which imports vue.runtime.js through bootCDN.

Index.html file code:

The main. Js code:



This method mainly uses the h in the render function to create the tag.

Method 3: Use vue-loader

This method can translate the. Vue file into the h build method. Create demo. vue in the Components folder as follows:

This component is called a single-file component

Main.js contains the following contents:

Render result: +1 can be done

conclusion