Skip to content

Latest commit

 

History

History
85 lines (40 loc) · 2.03 KB

05-Home.md

File metadata and controls

85 lines (40 loc) · 2.03 KB

Home 页装修

选择需要 copy 的好看背景图

  • dribbble.com
  • 参考 vuejs 和 React 官网
  • 参考 element-ui 等 ui 页面的官网

CSS 相关

  • 如何画一个渐变色背景？参考这个网站 https://cssgradient.io/

  • 使用 border-radius 和 clip-path 做圆角

border-bottom-left-radius: 50% 40px
border-bottom-rihgt-radius: 50% 100px

方法2：

clip-path

  • 使用 grid 布局

CSS Grid 网格布局教程-阮一峰 CSS Grid-MDN

  • 响应式页面

使用 @media 做手机端

文档页

使用 markdown 样式：

github-markdown-css

开发 Vite 插件，支持 markdown 文件解析

代码多次优化，使用 【事不过三】原则

遇到问题，路由不显示？ router 需要设置 key

当前代码缺点：使用异步加载的方式加载组件，可能需要等待时间。 解决办法：使用 SSR，但是当前 Vite 没有相关 SSR 方案，因此无解，如果要支持，需要自己搭建一套SSR

抽离 Switch1Demo，书写 展示页样式

展示源代码

使用 Vue-loader的Custom Blocks 功能

高亮源代码

https://prismjs.com

安装： yarn add prismjs

封装 Demo 组件

将 样式，高亮代码等逻辑，封装在 Demo 组件中