Nuxt.js 使用 fullPage.js 支持 SSR

一、简介

• fullpage.js 与 vue-fullpage.js 优先用前者，后者会因为用到 window 对象而报错 window is not defined 错误，但是 fullpage.js 可以通过本地导入的方式很方便的避开这个错误。

• Error：Fullpage.js version 3 has changed its license to GPLv3 and it requires a licenseKey option. Read about it here 解决方案。

• 附带：Nuxt.js 本地（CDN 远程）JS/CSS 全局（单页面）导入

二、fullpage.js 配置使用

• 创建 Nuxt 项目后，下载 fullpage.js 找到 /dist/fullpage.min.js 文件，拷贝放到 /static 目录下导入并使用：

  

  配置是放在 mounted() 中进行的，不能放到 created() 里面，必须要页面挂载之后才能进行配置。

• 使用效果

  

• 注意一个小细节，每次刷新的时候由于单个页面的 div 没有高度，可能会连在一起：

  

  这种情况需要默认给与每个页面 div 添加一个高度，如果是全屏的话，可以设置为当前窗口高度，就能避免刷新出现闪动问题。