基金会站点 (6) JavaScript 顺序

Question

我对如何插入单个基础javascript感到非常困惑。 它似乎总是破坏我的代码。 例如，我需要使用下拉菜单 js。在文档中它指出

初始 化 文件 foundation.dropdownMenu.js 必须包含在您的 JavaScript 中才能使用此插件，

以及Foundation.core.js。

此插件还需要以下实用程序库：

基础.实用.键盘.js

基金会.util.box.js

Foundation.util.nest.js

这看起来很简单，所以我按此顺序执行以下操作

bower_components/foundation-sites/js/foundation.core.js  //check 
bower_components/foundation-sites/js/foundation.util.mediaQuery.js
bower_components/foundation-sites/js/foundation.util.timerAndImageLoader.js
bower_components/foundation-sites/js/foundation.util.keyboard.js  //check 
bower_components/foundation-sites/js/foundation.util.box.js  //check 
bower_components/foundation-sites/js/foundation.util.nest.js  //check 
bower_components/foundation-sites/js/foundation.dropdown.js
bower_components/foundation-sites/js/foundation.dropdownMenu.js  //check 
bower_components/foundation-sites/js/foundation.equalizer.js

我遵循什么逻辑对我来说核心第一比实用程序比插件但它告诉我foundation.util.nest.js:6 Uncaught SyntaxError: Unexpected token =

如果我把所有 foundation.min.js 文件错误消失，所以我知道它一定是依赖项丢失或顺序不正确

有没有任何资源清楚基础JS的依赖性？ 相反，每次我都必须跟踪并错误它。

Answer 1

我遇到了同样的问题。我在我的项目中使用 Foundation 作为 GIT 子树，实际上已经在我上周制作的网站上使用了它。

问题似乎是函数参数声明的较新版本。在我工作的代码 v6.1.2 中，foundation.util.nest 中的代码.js是：

Foundation.Nest = {
  Feather: function(menu, type){
    menu.attr('role', 'menubar');
    type = type || 'zf';

与最新版本 6.2.0 中的代码相比，它是：

const Nest = {
  Feather(menu, type = 'zf') {
    menu.attr('role', 'menubar');

正是"类型"的默认/回退声明似乎毁了一切。我期待着自己修复。

根据此链接，我当前版本的Chrome（48）尚不支持默认功能参数。

Answer 2

从Foundation v6.2.0开始，JavaScript代码库已经更新到ES6。https://github.com/zurb/foundation-sites/releases

您需要将 Babel 添加到构建过程中以编译 ES6 代码。

他们在这里为此提供了一个教程：https://github.com/zurb/foundation-sites/wiki/Upgrading-to-Foundation-6.2

希望这有帮助。