安裝簡(jiǎn)單 直接看上面官網(wǎng)鏈接
這里記錄一下在安裝vue時(shí)遇到的問(wèn)題（糾結(jié)了一個(gè)小時(shí)）
①運(yùn)行yarn global add @vue/cli? 成功??
②查看版本號(hào)?vue --version? ?顯示2.9.6 版本? （可能是以前看別的學(xué)習(xí)資料時(shí)裝的低版本）
? ? 遇到這個(gè)問(wèn)題查資料，后面發(fā)現(xiàn)官網(wǎng)有講解（反省自己 以后找資料一定優(yōu)先在官方文檔查看）
? ? 最后以及升級(jí)???
? ??????????01————yarn global upgrade --latest @vue/cli? ?命令運(yùn)行??
? ? ? ? ? ? ?02————?yarn global add @vue/cli??
? ? ? ? ? ? ?03————?vue --version（還是報(bào)錯(cuò) 說(shuō)不存在）最后解決辦法重啟vscode? ? ? ??
使用 @vue/cli搭建項(xiàng)目
① 根據(jù)vue-cli官方文檔快速創(chuàng)建——點(diǎn)擊鏈接
② 線上創(chuàng)建修改 下載? 鏈接地址https://codesandbox.io/s/vue
簡(jiǎn)單搭建一個(gè)項(xiàng)目示例
附下面兩個(gè)圖 圖一為代碼示例 圖二為瀏覽器效果示例
以上代碼用到的知識(shí)下面詳解
①vue實(shí)例
方法1：從html得到視圖 （體積大 功能強(qiáng)）
? ? 也就是從文檔里說(shuō)的 `完整版Vue`[引入時(shí)后綴為vue.js]? === 它的優(yōu)點(diǎn)是可以在html中得到視圖
? ? 從CND引用vue.js或vue.min.js即可做到
? ? 也可以通過(guò)import引用vue.js或者vue.min.js
? ? 詳情看官方文檔這一節(jié)，把a(bǔ)lias去掉即可
方法2：用JS構(gòu)建視圖 （體積小 功能弱）==>>但是高級(jí)方法用?
? ? 還是看上面的文檔鏈接，使用vue.runtime.js【引入時(shí)后綴為vue.runtime.js】===它不能在html中得到視圖，但是它更加獨(dú)立
? ? 這種方法很不方便，但實(shí)際上是對(duì)的
方法3：使用vue-loader （） ==>>為上面方法的升級(jí) 安裝vue-loader 程序員時(shí)候用方法1 給用戶看的時(shí)候用方法二 實(shí)現(xiàn)了體積小 功能強(qiáng)
? ? 可以把.vue營(yíng)業(yè)日翻譯成h構(gòu)建方法
? ? 但這樣做HTML就只有一個(gè)div#app,SEO不友好
方法1圖解
方法2圖解
方法3圖解
也叫vue 單文件組件
什么是SEO
搜索引擎優(yōu)化
你可以認(rèn)為搜索引擎就是不停地curl
搜索引擎根據(jù)curl結(jié)果猜測(cè)頁(yè)面內(nèi)容，
如果你的頁(yè)面都是用JS創(chuàng)建div的撵幽，那么curl就很瞎
解決方法
給curl一點(diǎn)內(nèi)容
把title、description凌唬、keyword并齐、h1、a寫(xiě)好即可
原則：讓curl能得到頁(yè)面的信息客税，SEO就能正常工作
圖解：
以上內(nèi)容總結(jié)圖展示
