Uncaught TypeError: $ is not a function - Breaking store

DevBijan · ‎06-27-2022

Hello, I have a client whose store has seemed to break after the newest Shopify updates. I'm not too sure how to fix it, I am getting this error in console.

  Variants.prototype = _.assignIn({}, Variants.prototype, {
    /**
     * Get the currently selected options from add-to-cart form. Works with all
     * form input elements.
     *
     * @Return {array} options - Values of currently selected variants
     */
    _getCurrentOptions: function() {
      var currentOptions = _.map(
        $(this.singleOptionSelector, this.$container),
        function(element) {
          var $element = $(element);
          var type = $element.attr('type');
          var currentOption = {};

          if (type === 'radio' || type === 'checkbox') {
            if ($element[0].checked) {
              currentOption.value = $element.val();
              currentOption.index = $element.data('index');

              return currentOption;
            } else {
              return false;
            }
          } else {
            currentOption.value = $element.val();
            currentOption.index = $element.data('index');

            return currentOption;
          }
        }
      );

      // remove any unchecked input values if using radio buttons or checkboxes
      currentOptions = _.compact(currentOptions);

      return currentOptions;
    }

Here is the function where the error is occurring.

Any help or ides would be great, thanks!

squadkin · ‎06-28-2022

Hi DevBijan,

This code is written in jquery and you might haven't called jquery in your theme.liquid file or you have called jquery after the theme.js file

For that, navigate to theme.liqudi and add add below script under </head> tag or before theme.js file in theme.liquid.

<script src="https://code.jquery.com/jquery-3.6.0.min.js" async></script>

just like the below example.

<head>
/* other script and codes... */

<script src="https://code.jquery.com/jquery-3.6.0.min.js" async></script>
</head>

If you still facing trouble then just drop a mail at support@squadkin.com. our dev team will help you to resolve this query.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire us.
- Feel free to contact us on support@squadkin.com regarding any help
Shopify Partner | Skype : squadkin

View solution in original post

DevBijan · ‎06-27-2022

Forgot to mention that this is Brooklyn theme. Thanks!

squadkin · ‎06-28-2022

Hi DevBijan,

This code is written in jquery and you might haven't called jquery in your theme.liquid file or you have called jquery after the theme.js file

For that, navigate to theme.liqudi and add add below script under </head> tag or before theme.js file in theme.liquid.

<script src="https://code.jquery.com/jquery-3.6.0.min.js" async></script>

just like the below example.

<head>
/* other script and codes... */

<script src="https://code.jquery.com/jquery-3.6.0.min.js" async></script>
</head>

If you still facing trouble then just drop a mail at support@squadkin.com. our dev team will help you to resolve this query.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire us.
- Feel free to contact us on support@squadkin.com regarding any help
Shopify Partner | Skype : squadkin

DevBijan · ‎06-29-2022

Thank you!

itshaze · ‎02-20-2025

Thanks

Uncaught TypeError: $ is not a function - Breaking store

Uncaught TypeError: $ is not a function - Breaking store

Community Blog Articles