用UI視圖創建時，會自動進入一個網頁，然后在里面進行操作和項目管理。
但是常用命令行創建.
程序員都用md文件寫(readme.md)。
####環境
package.json里的scripts:里可以寫一些自己要的命令行，最后npm run +自定義指令執行，
(package.json里不能有任何多余的字符等，也不能有注釋，一般不要動，npm自動生成管理)
babel 是js編輯器,把es6及以上的代碼轉化為es5的代碼.
babel.config.js就是babel的配置文件。
.gitignore就是忽略列表
所有的第三方依賴包都放在node——modules里
public是一個本地服務器
啟動項目：
進入項目目錄后，執行npm run serve，啟動一個本地開發服務器。
Src就是寫代碼的地方，
里面的assets放靜態資源.
components放可以被復用的組件。
APP.vue就是根容器(根組件)
main.js是整個應用程序的入口文件（第一行代碼從這開始走）
Vue.config.productionTip = false;//在main.js里
關閉生產環境下的提示，對應的就是開發環境開啟。
被注入的腳本文件會自動的添加在被掛載的地方
$mount('#app')掛載，不是本文件里默認的#app，是index.html里的#app.
webpack會實時的將main.js和index結合起來。
一個.vue的文件就是一個組件
eslint是一個代碼檢測工具，它的目標是把當前程序中不規范的代碼找出來並報錯，讓你糾正.
<template></template>里不能有多個子節點
組件的引入：
css里的全局樣式寫在APP.vue里，
<style scoped>這里scoped表示這里的css只限於當前vue文件使用，對其他組件不影響
app.vue里不加scoped，其他所有組件都要加scoped
單文件組件：
在很多 Vue 項目中，我們使用
Vue.component 來定義全局組件，緊接着用 new Vue({ el: '#container '}) 在每個頁面內指定一個容器元素。
這種方式在很多中小規模的項目中運作的很好，在這些項目里 JavaScript 只被用來加強特定的視圖。但當在更復雜的項目中，或者你的前端完全由 JavaScript 驅動的時候，下面這些缺點將變得非常明顯：
-
全局定義 (Global definitions) 強制要求每個 component 中的命名不得重復
-
字符串模板 (String templates) 缺乏語法高亮，在 HTML 有多行的時候，需要用到丑陋的 \
-
不支持 CSS (No CSS support) 意味着當 HTML 和 JavaScript 組件化時，CSS 明顯被遺漏
-
沒有構建步驟 (No build step) 限制只能使用 HTML 和 ES5 JavaScript，而不能使用預處理器，如 Pug (formerly Jade) 和 Babel
文件擴展名為 .vue 的 single-file components (單文件組件) 為以上所有問題提供了解決方法，並且還可以使用 webpack 或 Browserify 等構建工具。
##路由：
單頁面應用程序 VS 多頁面應用程序
組件的創建與銷毀，vue單頁面是組件之間不斷的創建與銷毀
有了路由就能實現單文件應用，如何使用呢？
①:現在src文件夾里創建一個router.js文件
②:在main.js里導入路由
③:在根容器APP.vue里引入視圖容器.
router-link是vue-router的內置組件，他可以觸發URL的改變。在路由系統，URL變化，所匹配的組件也發生變化.
做一個選項卡切換的todolist：
<router-link to='./todo'></router-link>
(默認會在html界面渲染成一個a標簽);
<router-view></router-view>
router-link有一個tag屬性：(設置該標簽在最終渲染出來時的承載標簽，點擊效果不會丟失，vue有內部api處理好點擊效果)
<router-link to='./todo' tag='span'></router-link>
①:創建三個vue組件的頁面。
②:在router.js(路由模塊)里導入三個模塊
③:在根組件(APP.vue)里添入視圖容器
給router-link標簽添加高亮樣式
mode：用於指定路由模式，常用有兩種，分別是hash和history.（帶#號的是哈希路由）.