6.【nuxt起步】-完成一個靜態的頁面

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

 

把這些html代碼copy到maincontent.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不利