Vue (introduced directly using <script>, CDN)

Introduce VUE through <script>

There are 2 versions on the VUE official website ( https://cn.vuejs.org/v2/guide/installation.html ), click on the "development version" or "production version", a vue.js file will be downloaded

Here I click "Development Version" to download to a vue.js

Create a vueStudy project, copy vue.js to the vueStudy directory, and create a new html file index.html under the vueStudy directory.

When I later learn more complex applications of VUE, for example, use the CLI to create a more complex application that supports single-file components, then the file suffix name created under the project can be .vue.

In index.html:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="vue.js" type="text/javascript" charset="UTF-8"></script>
    </head>
    <body>
    </body>
</html>

Once vue.js was introduced, the project was already installed vue.js

If you see two warnings in the console, it means that vue.js has been successfully deployed into the project

Once vue.js is introduced, a global variable will be exposed. A global operation can be performed through the Vue () function.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="vue.js" type="text/javascript" charset="UTF-8"></script>
    </head>
    <body>
        <script>  Vue()  
</script>
    </body>
</html>

Introduced by CDN

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    </head>
    <body>
    </body>
</html>

The deployment operation is complete

Vue (introduced directly using <script>, CDN)

Guess you like