- 在页面头部加入Vue
- 把body里面的所有的内容放在一个script标签中去
- 在body里面放一个div，加一个id属性取名为app，这个可以随便
- 在所有页面逻辑前面加入一个script标签，写入new Vue代码
列子：
<script type="text/x-template" id="my-component-template">
这里面写元素，要遵循Vue元素的写法
</script>
<script>
let AppVm = new Vue({
el: '#app',
template: '#my-component-template', // 采用这样写，模板会进入编译，但是模板不在script中就不会进入编译
data() {
return{
}
},
methods:{
saveFollowProject() {
}
}
})
</script>
完整：
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="UTF-8">
<title>h5旧页面接入Vue最佳方案</title>
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0">
<script src="../vue2.6.14/vue.min.js"></script>
</head>
<body>
<div id="app"></div>
</body>
<script type="text/x-template" id="my-component-template">
这里面写元素，要遵循Vue元素的写法
</script>
<script>
let AppVm = new Vue({
el: '#app',
template: '#my-component-template', // 采用这样写，模板会进入编译，但是模板不在script中就不会进入编译
data() {
return{
}
},
methods:{
saveFollowProject() {
}
}
})
</script>
<!--下面是其他的业务逻辑，这样接入不会导致原逻辑错误-->
</html>
