以整个视口为单位，使用滑轮滚动或导航触发来达到展示效果的网站是一种需求。一种是自己手写 js + css 来达到这种效果。还有一种使用 fullpage.js 来达到这个效果。当然，使用 swiperjs 来实现这效果也是妥妥的赞，还很丝滑。
https://github.com/alvarotrigo/fullPage.js
https://swiperjs.com/get-started
主要是 fullpage.js 是需要花钱购买服务，而 swiperjs 是开源使用的。并且 swiperjs 不仅仅可以做这种视口滚动效果。
所以，这里选择使用 swiperjs 来完成目标。
DEMO 展示效果如下图所示（gif 使用 https://www.mnggiflab.com/ 录制和压缩）：
操作
初始化一个 vue 项目。
pnpm create vue
cd swiperFullpage
pnpm install
pnpm format
pnpm dev创建选项如下图所示。
然后，创建一个版本管理。
git init
git add .
git commit -m 'initialize'