{"id":17276,"library":"jquery.qrcode","title":"jQuery QRCode Generator","description":"jquery.qrcode is a pure browser-side jQuery plugin designed for generating QR codes dynamically within web pages. Released over a decade ago, its last stable version, 1.0.3, was published in 2016. The package does not have a regular release cadence and is no longer actively maintained under its primary npm listing. Its key differentiators include being a standalone solution, generating QR codes without relying on external services, producing compact output (less than 4KB minified and gzipped), and not requiring image downloads. This approach minimizes latency and external dependencies, making it suitable for environments where offline capability or strict control over assets is required. However, its age means it predates modern JavaScript module systems and may have compatibility issues with recent jQuery versions or build tools. Newer, actively maintained QR code libraries and jQuery plugin forks (like lrsjng/jquery-qrcode) are available as alternatives.","status":"abandoned","version":"1.0.3","language":"javascript","source_language":"en","source_url":"https://github.com/liu-dongyu/jquery-qrcode","tags":["javascript","jquery","qrcode"],"install":[{"cmd":"npm install jquery.qrcode","lang":"bash","label":"npm"},{"cmd":"yarn add jquery.qrcode","lang":"bash","label":"yarn"},{"cmd":"pnpm add jquery.qrcode","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"This is a jQuery plugin and requires jQuery to be loaded on the page to function.","package":"jquery","optional":false}],"imports":[{"note":"This is a traditional jQuery plugin; it attaches its functionality directly to the jQuery prototype (`$.fn`). It is not an ES module or CommonJS module and should be included via a `<script>` tag after jQuery itself.","wrong":"import { qrcode } from 'jquery.qrcode'; // Not a module, extends jQuery prototype","symbol":"jQuery.fn.qrcode","correct":"<!-- After jQuery and jquery.qrcode.min.js scripts are loaded -->\n$('#qrcode').qrcode('https://example.com');"},{"note":"Options for width, height, and the QR code content are passed as an object literal to the `.qrcode()` method.","wrong":"$('#qrcode').qrcode().config({ width: 128 }); // Configuration is passed directly to the qrcode method","symbol":"Configuration options","correct":"$('#qrcode').qrcode({ width: 128, height: 128, text: 'Hello World!' });"}],"quickstart":{"code":"<!-- index.html -->\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>jQuery QRCode Quickstart</title>\n    <script type=\"text/javascript\" src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>\n    <script type=\"text/javascript\" src=\"https://cdnjs.cloudflare.com/ajax/libs/jquery.qrcode/1.0/jquery.qrcode.min.js\"></script>\n</head>\n<body>\n    <h1>Scan Me!</h1>\n    <div id=\"qrcode-container\"></div>\n\n    <script type=\"text/javascript\">\n        $(document).ready(function() {\n            const currentUrl = window.location.href;\n            $('#qrcode-container').qrcode({\n                width: 256,\n                height: 256,\n                text: currentUrl,\n                // Optional: set the color\n                // 'color': '#3a3',\n                // 'ecLevel': 'H' // Error Correction Level: L, M, Q, H\n            });\n            console.log('QR Code generated for URL:', currentUrl);\n        });\n    </script>\n</body>\n</html>","lang":"javascript","description":"Demonstrates how to include jQuery and jquery.qrcode via CDN, then generate a QR code for the current page's URL within a specified DOM element upon document ready."},"warnings":[{"fix":"Consider migrating to actively maintained QR code generation libraries. For jQuery projects, forks like `lrsjng/jquery-qrcode` (found on GitHub, not npm under this name) might offer better compatibility. For non-jQuery projects, pure JavaScript alternatives like `qrcode.js` or modern framework-specific components are recommended.","message":"The `jquery.qrcode` package (v1.0.3) has not been updated in over 10 years, meaning it likely has unresolved bugs and lacks security patches. It relies on older jQuery versions and may not be compatible with modern jQuery (e.g., jQuery 3.x or 4.x) due to changes in jQuery's API.","severity":"breaking","affected_versions":"1.0.3"},{"fix":"Include `jquery.qrcode.min.js` via a `<script>` tag after jQuery, or configure your bundler (e.g., Webpack, Rollup) to treat it as a global script and ensure jQuery is available globally.","message":"This package is a traditional jQuery plugin designed for script-tag inclusion in HTML. It does not natively support ES Modules (`import`) or CommonJS (`require`) syntax. Attempting to import it directly in a modern JavaScript module environment will result in errors.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Evaluate newer, actively maintained QR code libraries. For browser-only use cases, consider modern pure JavaScript libraries that don't depend on jQuery or more actively maintained jQuery plugin forks.","message":"The original GitHub repository (`jeromeetienne/jquery-qrcode`) and the npm package (`jquery.qrcode` v1.0.3) are largely unmaintained. There's no active development, bug fixes, or new features planned for this specific npm package version.","severity":"deprecated","affected_versions":">=1.0.3"}],"env_vars":null,"last_verified":"2026-04-22T00:00:00.000Z","next_check":"2026-07-21T00:00:00.000Z","problems":[{"fix":"Ensure jQuery is loaded first, followed by `jquery.qrcode.min.js`, both via `<script>` tags, before attempting to call the `.qrcode()` method. Check script paths and loading order in your HTML.","cause":"The `jquery.qrcode.js` script was not loaded, or it was loaded before jQuery, or jQuery itself was not loaded.","error":"TypeError: $(...).qrcode is not a function"},{"fix":"Add a `<script>` tag for jQuery (e.g., from a CDN like `https://code.jquery.com/jquery-3.6.0.min.js`) before your `jquery.qrcode.min.js` script and any custom JavaScript code that uses jQuery.","cause":"jQuery library itself has not been loaded before `jquery.qrcode.js` or any script attempting to use `$` (or `jQuery`).","error":"ReferenceError: $ is not defined"}],"ecosystem":"npm","meta_description":null}