1. 程式人生 > >6.完成一個靜態的頁面

6.完成一個靜態的頁面

1.接下來新建/component/maincontent.vue

 

把這些html程式碼copymaincontent.vue

發現格式比較難看,就格式化一下

2.外掛安裝 beautify,安裝後重啟vs,按F1 beaut,格式化html

 

css copy過來 重新整理

 

樣式有點問題。原來少了bootstrap.css,修改nuxt.confg.js增加bts

 

Npm run dev 發現報錯,原來bootstrap載入了字型 但專案裡沒有包含,

 

把字型copy過來放到目錄 重新npm run dev

 

正常了

接下來按照上面的方式,把剩下 maincontent都完善起來。

 

這樣就把maincontent完成了,接下來把footer.vue也實現

 

這樣一個純靜態的nuxt+vue 就完成了,檢視原始碼

 

就會發現和純vue的區別,純vue是沒有文字的,所以對seo不利