从零开始搭建性能完备的网站-思路过程（1）

之前前端的一揽子技术基本都学完了，除了react和uniapp这些想做大前端需要学的东西，基本vue相关的东西都学过了，本来想做尚硅谷的后台项目，可是它使用的工具库实在是太老了，所以直接跳到自己搭建网站这一步来，考虑到要自己搭建商用项目，其中会设计到三块，一是构思和编码的过程，二是过程中遇到的难题解决，三是关于性能优化方面的思考。后端选型目前还没想好，暂时还是使用自己熟悉的python及其工具库，打算使用flask,实在不行迁移到django。
首先是页面参考。要做一个功能完备的卖鞋子网站作为示例，那么必须一步步的进行细化，否则就会因为繁重的任务把自己压垮。首先进行数据的简化，为简化数据，先不考虑后台管理系统，大约使用10个静态物品分为三类，颜色，价格，品牌，然后首先完成静态页面，甚至登录和注册页面也可以先不考虑，说到写页面我们可以先参考现成的代码，之后在整个网站中保持风格一致即可。
首先采用最新的ts+vue3+pinia的技术选型，导航栏采用简单的图标加登录注册来完成。现在先使用vite来初始化项目。Yarn create vite指令，创建文件夹以后cd进入，然后yarn安装依赖。在package.json里面的yarn指令后面加上—open这样每次就能够自动打开浏览器不需要再次点击。日常报错找不到模块“./App.vue”或其相应的类型声明。ts(2307)，根据百度的结果，在env.d.ts文件中加入声明即可。
declare module “*.vue” {
import type { DefineComponent } from “vue”;
const vueComponent: DefineComponent<{}, {}, any>;
export default vueComponent;
}
根据构思，主体就是一个导航栏，简单起见里面加上登录和注册按钮，中间根据推荐或者自己的点击返回一个列表，在列表下方使用分页器，参考耐克官网的布局。

这里尽量使用ElementPlus的现成样式，少写样式，先使用ElementPlus的自动导入功能，先安装插件使用自动导入，
有遇到不明白怎么写的样式就参考一下别人的代码，可以看到，即使是简单的导航栏，如果不使用浮动也无法按照自己的想法布局，不得不说，真正做起项目来很多布局都需要自己来写，刚开始会很繁琐，只能坚持下去，图标我尽量使用iconfont,接口前期尽量自己mock数据，这样可以简化来自服务端的压力。

我预想中的图标在左边，登录和注册在右边，中间用|隔开这样美观一点，根据我喜欢的配色设置为lightblue，但是这个字体好像没有对齐，通过设置line-height发现不大行，
好吧，小小导航栏还挺麻烦，单独写一篇好了。