Getting “ReferenceError: jQuery is not defined” fo

Question

I have published a jRCarousel jQuery plugin to npm. I initially got the error that name can not contain capital letters, so I have changed that in package.json and then published it got published but on npm website when I try the "Try it out" option I get the "ReferenceError: jQuery is not defined" error. Not sure why is the error as I have specified the dependency in package.json.

Also if there are any changes to only package.json and not to any other files in package or module , how can I update only the package.json file on npm, or do I have to publish it new version no.(which I want to avoid).

Here is my package.json

{
  "name": "jrcarousel",
  "version": "1.0.0",
  "description": "jRCarousel - jQuery Responsive Carousel,
                  a modern, lightweight responsive carousel plugin",
  "main": "dist/jRCarousel.min.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/vinayakjadhav/jRCarousel.git"
  },
  "keywords": [
    "jquery-plugin",
    "ecosystem:jquery",
    "jQuery Resposive Carousel",
    "jQuery slider",
    "Responsive Slider",
    "Carousel",
    "Slider",
    "Gallery",
    "lightweight"
  ],
  "author": "Vinayak Rangnathrao Jadhav",
  "license": "MIT",
  "dependencies": {
    "jquery": "^1.9.1"
  },
  "bugs": {
    "url": "https://github.com/vinayakjadhav/jRCarousel/issues"
  },
  "homepage": "https://github.com/vinayakjadhav/jRCarousel",
  "devDependencies": {}
}

npm package

Github Repository

TRY IT OUT Link

Note: I am new to npm, have searched a lot but very less info available related to jquery-plugin publishing. Any help is appreciated.

Answer 1

Wrap your plugin with this code. It's the UMD pattern that allows your plugin to run inside browser and most of module bundlers.

(function (root, factory) {
    if (typeof define === "function" && define.amd) {
        define(["jquery"], factory);
    } else if (typeof exports === "object") {
        module.exports = factory(require("jquery"));
    } else {
        factory(root.jQuery);
    }
}(this, function ($) { 
    ...your plugin code goes here...
}));