Aurelia 骨架-esnext-webpack 与 zurb 基础 6.2,3答案

【问题标题】：Aurelia skeleton-esnext-webpack with zurb foundation 6.2,3Aurelia 骨架-esnext-webpack 与 zurb 基础 6.2,3
【发布时间】：2016-07-10 15:56:26
【问题描述】：

我正在尝试将 Zurb Foundation 6.2.3 与 Aurelia 一起使用，我开始使用skeleton-esnext-webpack。我遇到的问题是当我尝试初始化$(document).foundation() 时。下面是我的 main.js 中的 sn-p

const rootElement = document.body;
rootElement.setAttribute('aurelia-app', '');
await aurelia.start().then(a => a.setRoot('app', rootElement)).then(a => {
$(document).foundation();
    console.log('foundation loaded')
});

我是 webpack 和 esnext 的新手，但根据我的理解，我需要使用 require 或 import 包含基础。有人能指出我正确的方向并指导我解决这个问题吗？

非常感谢您的帮助。

问候，提基

【问题讨论】：

我假设您使用 npm 安装了foundation？如果是这样，您需要将它导入到您的主模块中（如果您正在初始化它）
是的，我确实使用 import {foundation} from 'foundation-sites/dist/foundation.min' 将它添加到我的主模块中；在调用 $(document).foundation(); 之前

标签： ecmascript-6 webpack aurelia zurb-foundation-6

【解决方案1】：

事实证明，发生的事情是两个部分的问题。一个 zurb 基础不兼容 jQuery 3.0，第二个 webpack 引入了传递依赖。我最终将jquery-migrate 1.3.0 包含为依赖项，并使用解析别名更新了webpack.config.js，如下所示，以确保只加载一次jQuery。

resolve: {
    alias: {
        'jquery': path.resolve(path.join(__dirname, 'node_modules', 'jquery'))
    }
}

【讨论】：