Vue.js的安装方法

第一种方法:独立版本

我们可以在Vue.js的官网上直接下载vue.min.js并用<script>标签引入

下载Vue.js:https://vuejs.org/js/vue.min.js

下载后命名为vuejs.org(名字随意,但后缀名一定要org)。如图:

Vue.js的安装方法

接下来就是引入到index.html里面。如图:

Vue.js的安装方法

第二种方法:使用CDN方法

以下推荐几个CDN:

  • Staticfile CDN:https//cdn.staticfile.org/vue/2.2.2/vue.min.js
  • unpkg:https//unpkg.com/vue/dist/vue.js   会保持和npm发布的最新版本一致
  • cdnjs:https//cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js

在index.html中引入CDN。如图:

Vue.js的安装方法

然后新建一个app.js文件(用于实例化Vue对象),并且在index.html中引入。如图:

Vue.js的安装方法

在app.js中实例化Vue对象。如图:

Vue.js的安装方法

然后就可以在index.html调用实例中的数据,格式为:{{ xx }},中间为要调用的数据。如图:

Vue.js的安装方法

浏览器效果图如下:

Vue.js的安装方法​​​​​​​