Webpack 导入和捆绑模块的正确方法

Question

我正在使用基于 Foundation 构建的 Wordpress 框架，并使用 Webpack 来捆绑 JS。 Webpack 的新手。

当我将 Slick.js 添加到我的项目时，我使用：

//import JS

import './lib/slick';

//init

$('.my-class').slick({});

这按预期工作，我没有收到任何错误。

但是，当我这样添加 sweetalert2.js 时：

import './lib/sweetalert2';

//init

swal({
  title: 'Error!',
  text: 'Do you want to continue',
  type: 'error',
  confirmButtonText: 'Cool'
});

我收到 swal is not defined 错误。

然而，这有效，我在启动时没有遇到任何错误。

import swal from './lib/sweetalert2';

我猜这与公开功能有关。但是，我试图理解为什么 slick.js 没有这样做而 sweetalert2 却没有。

谢谢。

Answer 1

看起来 slick 是一个 jQuery 插件，所以加载库只是将它固定到全局 jQuery 实例上，但 sweetalert2 是一个独立的，不想只创建一个全局对象（因为这通常是个坏主意）。

Webpack proper way to import and bundle modules