專案路由
前端路由：核心就是錨點值的改變，根據不同的值，渲染指定DOM位置的不同資料
ui-router：錨點值改變，如何獲取模版？ajax
vue中，模版資料不是通過ajax請求來，而是呼叫函式獲取模版內容

核心：錨點值改變
以後看到vue開頭，就必須知道Vue.use
Vue-router(路由),Vuex(管理全域性共享資料)

使用方式
1：下載  npm i vue-router -S
2: 引入，在main.js中引入   import VueRouter from 'vue-router'
3：安裝外掛 Vue.use(外掛)    Vue.use(VueRouter)
4：需要配置路由規則，需要個路由物件
let router=new
 
 VueRouter({routes:[path:'/home',component:Home} ] });

5：將其路由物件傳遞給Vue的例項，options中   router : router

6：留坑   <router-view></ruoter-view>

//引入一堆
import Vue from 'vue'
import VueRouter from 'vue-router'

//主體
import App from './components/app.vue'  
import Home from './components/home.vue'

//安裝外掛
Vue.use
 
(VueRouter); //掛載屬性

//建立路由物件並配置路由規則
let router=new VueRouter({
    routes:[
    //一個個物件
    {path:'/',component:Home}
    ]
})

//new Vue啟動
new Vue({
    el: '#app',
    //讓vue知道我們的路由規則
    router:router, //可以簡寫成router
    render:c=>c(App);
})




錯誤整理
1：Module not found:Error:Can't resolve 'vue-router'
可能是因為沒安裝好，

2：Uncaught Error:Cannot find module "vue-router"
沒有裝載vue-router, Vue.use(vue-router)  或者 npm i vue-router -S

3：Module not found:Error:Can`t resolve '
 
less-loader' 
在子元件中的樣式里加了程式碼
<style lang="less" scoped>

</style>
而這個less是需要安裝的，npm install --save-dev less-loader less
https://www.npmjs.com/package/less-loader
所以不想安裝的話可以直接刪掉，若要用就要安裝，否則就報錯

4：webpack後，出現htmlWebpackPlugin is not defined
說明沒有宣告htmlWebpackPlugin物件
const htmlWebpackPlugin=requrie('html-webpack-plugin')

5：Error：missing script: dev
在package.json中沒有這個命令，加入就好


重點：沒有留坑和規則不匹配，當沒顯示的時候可能的原因


基於webpack編譯，就要打包