====== VUE 框架 ======
记录 Vue 框架的使用以及问题。

===== 创建工程 =====

创建新的工程：<color #ff7f27>''%%vue create projectname%%''</color>

选择Typescript，工程建立完成以后进入工程目录，运行 <color #ff7f27>''%%npm run serve%%''</color> 就会启动端口8080的本地网站服务。而且是实时监测，源代码的改动后会自动更新到网页。

===== 调试 =====
传统方式：在Chrome打开开发者工具，在console页面下调试。

Vue 开发了一个 chrome 插件，安装完后启动Vue扩展，Chrome的<color #7092be>开发者工具</color>多出一个Vue的选项。点开它即可以进入Vue自身的调试环境(([[https://zhuanlan.zhihu.com/p/33771617|使用Vue.js的DevTools来调试vue项目]]))。打开后需要刷新一下页面，就会出现 <color #7092be><Root></color> 元素，这就是整个工程的根元素。\\
{{:it:framework:vue_devtool01.png?400|}}



{{tag>building}}