在FoundationPress中使用fullpage.js时遭遇IScroll未定义错误求助

Let's break down why this error pops up and how to fix it quickly:

The scrolloverflow.min.js plugin for fullpage.js depends directly on the IScroll library, and right now your setup isn't making IScroll available globally when scrolloverflow tries to access it. Here's the step-by-step fix:

Step 1: Install IScroll (if you haven't already) #

First, make sure IScroll is added to your project dependencies. If you're using npm, run this in your terminal:

npm install iscroll --save

Step 2: Adjust your import order & expose IScroll globally #

Update your import code to load IScroll first, and explicitly attach it to the window object so scrolloverflow can access it. Here's the corrected order:

import $ from 'jquery';
import 'slick-carousel';
// Import IScroll first and expose it globally
import IScroll from 'iscroll';
window.IScroll = IScroll;
// Now load scrolloverflow and fullpage.js
import 'fullpage.js/vendors/scrolloverflow.min.js';
import 'fullpage.js';

Why this works #

The scrolloverflow.min.js script expects IScroll to be a global variable (it doesn’t use ES module imports internally). By importing IScroll first and attaching it to window, you make it available exactly where scrolloverflow needs it, before the plugin itself loads.

Verify the fix #

After updating your imports, recompile your FoundationPress project. Your fullpage initialization code should now run without the IScroll error, and the scrollOverflow: true setting will generate scrollbars for content that exceeds the section/slide height as expected.

内容的提问来源于stack exchange，提问作者Maxence Barbou