Browserify FullCalendar with external jQuery

Browserify FullCalendar with external jQuery

本文关键字：jQuery external with FullCalendar Browserify      更新时间：2023-09-26

我正在从CDN加载jQuery，当我尝试将FullCalendar导入我的脚本时会发生此错误：

未捕获的错误：找不到模块"jquery"

这是我的脚本：

'use strict'
import $ from 'jquery'
import 'fullcalendar'
$('#calendar').fullCalendar()

我正在运行以下命令来转换我的脚本：

browserify index.js -t babelify -x jquery > index.min.js

我的 HTML 看起来像这样：

<!DOCTYPE html>
<div id=calendar></div>
<script src=https://code.jquery.com/jquery-2.2.0.min.js></script>
<script src=index.min.js></script>

我也尝试过用depends: ['jquery', 'moment']浏览器化填充码，但这没有任何区别。

我怀疑这是因为 FullCalendar JS 文件有一个 UMD 包装器，它有自己的require('jquery')和require('moment')但我认为外部标志足够聪明，可以检测到这一点。

有什么方法可以解决此问题吗？

更新：这是我试图实现的一个最小示例，但是我的实际代码涉及比 FullCalendar 更多的依赖项，并且所有第三方依赖项都连接成一个vendor.min.js文件，与我们的代码分开（例如 index.js）。

我能够通过将全日历工厂中的require('jquery')更改为$来使其工作。

此外，无需在索引.js文件中使用 import $ from 'jquery'。它已经是完整日历 npm 中的依赖项。

运行后

browserify index.js -t babelify -x jquery > index.min.js

在完整日历工厂函数中编辑 index.min.js 文件，该文件显示：

else if(typeof exports === 'object') {
    module.exports = factory(require('jquery'), require('moment'));
}

自：

else if(typeof exports === 'object') {
    module.exports = factory($, require('moment'));
}

或者，您可以直接在node_modules/fullcalendar/dist/fullcalendar.js文件中进行此编辑。

我希望这有帮助！

相关文章：