admin管理员组

文章数量:1421700

I am loading jQuery from a CDN and this error occurs when I try to import FullCalendar into my scripts:

Uncaught Error: Cannot find module 'jquery'

Here is my script:

'use strict'

import $ from 'jquery'
import 'fullcalendar'

$('#calendar').fullCalendar()

I'm running this mand to transform my script:

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

My HTML looks like this:

<!DOCTYPE html>
<div id=calendar></div>
<script src=.2.0.min.js></script>
<script src=index.min.js></script>

I have also tried browserify-shim with depends: ['jquery', 'moment'] but it does not make any difference.

I suspect that it is because the FullCalendar JS file has a UMD wrapper that does its own require('jquery') and require('moment') but I thought the external flag would be smart enough to detect this.

Any way I can work around this problem?

Update: This was a minimal example of what I am trying to achieve, however my actual code involves many more dependencies than FullCalendar, and all third-party dependencies are concatenated into a vendor.min.js file, separated from our code (such as index.js).

I am loading jQuery from a CDN and this error occurs when I try to import FullCalendar into my scripts:

Uncaught Error: Cannot find module 'jquery'

Here is my script:

'use strict'

import $ from 'jquery'
import 'fullcalendar'

$('#calendar').fullCalendar()

I'm running this mand to transform my script:

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

My HTML looks like this:

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

I have also tried browserify-shim with depends: ['jquery', 'moment'] but it does not make any difference.

I suspect that it is because the FullCalendar JS file has a UMD wrapper that does its own require('jquery') and require('moment') but I thought the external flag would be smart enough to detect this.

Any way I can work around this problem?

Update: This was a minimal example of what I am trying to achieve, however my actual code involves many more dependencies than FullCalendar, and all third-party dependencies are concatenated into a vendor.min.js file, separated from our code (such as index.js).

  • javascript
  • jquery
  • fullcalendar
  • external
  • browserify
Share Improve this question edited Feb 8, 2016 at 7:23 rink.attendant.6 asked Jan 29, 2016 at 22:47 rink.attendant.6rink.attendant.6 46.5k64 gold badges110 silver badges157 bronze badges 7
  • Did you try using the expose global part of browserify-shim? – zero298 Commented Jan 29, 2016 at 23:01
  • @zero298 The library just attaches itself to $ without exposing anything I believe. I have gotten other jQuery plugins to work successfully with the external jQuery (either with or without shim), just not this one for some reason. – rink.attendant.6 Commented Jan 29, 2016 at 23:08
  • what happens if you change the script to import $ instead of import $ from 'jquery'? – Anthony Commented Feb 8, 2016 at 7:29
  • Is this at all related to the fullCalendar issue : github./fullcalendar/fullcalendar/pull/222 which appears fixed in more recent versions? – Anthony Commented Feb 8, 2016 at 7:54
  • @Anthony import $; produces a transpile-time error: SyntaxError: Unexpected token. And I assume the GitHub issue that you linked to is related though I am using the latest version 2.6.0. – rink.attendant.6 Commented Feb 8, 2016 at 16:05
 |  Show 2 more ments

1 Answer 1

Reset to default 6 +50

I was able to get it working by changing require('jquery') in the fullcalendar factory to $.

Also, no need to use import $ from 'jquery' in your index.js file. It is already a dependency in the fullcalendar npm.

After running

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

Edit the index.min.js file in the fullcalendar factory function where it reads:

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

to:

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

Alternately, you could make this edit directly in the node_modules/fullcalendar/dist/fullcalendar.js file.

I hope this helps!

本文标签： javascriptBrowserify FullCalendar with external jQueryStack Overflow

版权声明：本文标题：javascript - Browserify FullCalendar with external jQuery - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1745354839a2654987.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。