1.介绍
Vue是一套用于构建用户界面的渐进式框架 ,Vue 被设计为可以自底向上逐层应用。 Vue 的核心库只关注视图层
2.下载
进入 vue.js官网 https://cn.vuejs.org/v2/guide/installation.html
或者在搜索引擎上搜 vue的官网
下载方式1:
进入官网后,根据需要,点击开发版本或者生产版本,下载vue.js文件
下载方式2:
开发版本: https://cdn.jsdelivr.net/npm/vue/dist/vue.js
生产版本: https://cdn.jsdelivr.net/npm/vue
把网址在浏览器中输入,回车
右键 另存为 或者 ctrl +s,选择保存位置,就可以下载成功vue.js文件了
3.安装
方式1: 直接使用 <script>
引入
<script src="vue.js"></script>
方式2: 使用 CDN 方法
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
或者
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
注意:使用CDN方法,需要连网才能引入vue.js
4.第一个Vue程序
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第一个vue程序</title>
<script src="vue.js"></script>
</head>
<body>
<div id="app">
{{message}}
</div>
<script>
new Vue({
el:'#app',
data:{
message:'Hello Vue'
}
})
</script>
</body>
</html>
运行效果图:
如果在浏览器中看到标红线的内容,就说明vue.js引入成功了。