首先说一下需求和背景:
因为公司需要对老的官网进行重新设计,配套的可配置官网的后台管理系统也需要重新设计。因为需要做SEO,我本身也是用了很多年的vue,所以优先选择SSR的nuxt,因为官网比较简单,所以暂时没遇到多大的坑。
1.安装nuxt:nuxt官网。
2.创建之后的文件目录:
注意2点:A:背景图需要放在static里面。在js里面引用的时候可以直接这样引用 ' logoBox: ["/images/logo1.png"], '
B:放在img的src的静态图片,就 html里面这样写 ' ~/assets/img/xxx.png ',在js里面要类似这样写 ‘ require("../../assets/img/B4/gntp.png"), ’
3.开始写,官网就简单分成3块,头部导航栏,中心的body,底部的导航栏等。在layouts文件夹下面的default.vue里面写好就行。
4.样式写好,需要与后台进行交互,使用官方推荐的@nuxtjs/axios。说一下怎么配置axios
A:在nuxt.config.js里面的modules里面添加axios
B: post请求一定跨域,增加反向代理。写axios的一些配置,以及proxy。贴代码:
C:在