一、如何引用Vue.js到html文件里
1.以cdn的方式引入
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
将上面代码添加到html的head里，即可全局使用vue的方法；
2.直接将vue文件保存到本地，再引入
可以采取下面方法：
（1）将CDN的路径（https://cdn.jsdelivr.net/npm/vue/dist/vue.js）复制到浏览器，并搜索；
（2）将搜索到的内容全选复制项目的vue.js文件里，如图；
（3）在index.html里面引入；
上面是在原生HTML里面引入vue的方法，其他的同理，如：elementUI、ant Desgin Vue等，都可以用类似的方式引入到原生HTML里。
二、如何在html文件里使用VUE
成功引入vue后，我们就可以在html文件里使用vue，下面是示例；
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <script src="./vue.js"></script> </head> <body> <!-- 创建一个根元素 --> <div class="home" id="home"></div> <script> // 将vue挂载到id为home的根元素上 var vm = new Vue({ el: "#home", data() { return {}; }, methods: {}, mounted() {}, created() {}, }); </script> </body> </html>
这样就可以在html里面使用Vue了，下期我将分享在html里面使用Vue组件~
