I always get errors saying the function is not defined for the jquery plugins I used in meteor 1.3 and React

help
1

In my meteor 1.3 and React apps, when I try to use a jquery plugin, it won’t work. On the console, I always see an error saying the function is not defined. For example, Uncaught TypeError: $(...).countdown is not a function. Earlier I added the js files in the header like this in a index.html file (Placed in the app’s root):

<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.countdown/2.1.0/jquery.countdown.min.js"></script>
</head>

But since Meteor 1.3 moved all js to the footer, now I load them inside the body tag in the same index file. Now the files are loaded and the jquery plugins can find jQuery without issues. But have trouble using them in the react components. I wrap my functions inside componentDidMount and $(document).ready. But it’s not working. Any idea why?

2

I have the same issue like yours. I used the 3rd party plugin, jsgrid, in my app. It also showed error message when I upgraded to meteor 1.3.1 (in meteor 1.2 worked totally). The error message:

jsgrid.js:1430 Uncaught ReferenceError: jQuery is not defined
(function(window, $, undefined) { ... }(window, jQuery));

I found the article: Why your JQuery plugins may be failing in 1.3.1, but don’t know how to fix the issue in my case. Any idea why? Thanks.

3

Hi!
What pligin are you using? jsgrid?
Try to find it at Atmosphere and install.
After do not forget remove its old previous call via <script> tag in HEAD section.

1 Like
4

Many thanks your advise!! I moved the 3rd part code from /public to /client dir and removed the <script> tag for including the js files in my HEAD section. The app works very well!! :grinning:

5

What if it’s not in Atmosphere? :slight_smile:

6

@yinchen618 found solution for that case - put you lib files to /client folder

7

Wait, so now for most/some 3rd party jQuery plugins, I must import them from atmosphere hoping someone has wrapped all versions? i.e meteor-my-plugin-js for my-plugin.js

Or is there an easier way to do this? I had to go back to Meteor 1.2.1 on all my projects since this breaks everything with jQuery plugins.

If there isn’t, I think MDG should look into this and address it properly whether is a bug or not; And include it on the 1.2.x to 1.3 Migration guide.

Meanwhile I’m sticking on 1.2.1 regardless the super slow build time on Windows…