webpack 结合 Vue 使用的总结| 学习笔记

开发者学堂课程【前端自动化构建工具 Webpack：webpack 结合 Vue 使用的总结】学习笔记，与课程紧密联系，让用户快速学习知识。

课程地址：https://developer.aliyun.com/learning/course/587/detail/8230

webpack 结合 Vue 使用的总结

总结梳理 webpack 中如何使用 Vue：

1.webpack中如何让使用vue

（1）安装vue的包:cnpm i vue -s

（2）由于在wepack中，推荐使用.vue这个组件模板，所以，需要安装能解析这种文件的losder cnpm i vue-loader vue-template-complier -D

（3）在main.js中，导入vue模块 import Vue from’vue’

（4）定义一个.vue结尾的组件，其中组件由三部分组成：

template script style

（5）使用import  login from’./login.vue’导入这个组件

（6）创建vm的实例

var vm = new vue({el:’app’,rander,render:c=>(login)})

(7)在页面创建一个id为app的div元素，作为我们vn实例要控制的区域。