{"id":20785,"library":"webpack-jquery-ui","title":"webpack-jquery-ui","description":"This package bundles jQuery UI (v1.12.1) with all necessary webpack loaders and plugins, simplifying configuration. Maintained as a convenience wrapper, it provides modular imports for interactions, widgets, and effects, automatically loading core dependencies. Version 2.0.1 is the latest; use is declining as modern frameworks adopt native solutions. Key differentiator: reduces boilerplate for webpack + jQuery UI projects.","status":"maintenance","version":"2.0.1","language":"javascript","source_language":"en","source_url":null,"tags":["javascript","webpack","jquery","jquery-ui","loaders"],"install":[{"cmd":"npm install webpack-jquery-ui","lang":"bash","label":"npm"},{"cmd":"yarn add webpack-jquery-ui","lang":"bash","label":"yarn"},{"cmd":"pnpm add webpack-jquery-ui","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency required for jQuery UI","package":"jquery","optional":false},{"reason":"core jQuery UI library","package":"jquery-ui","optional":false},{"reason":"required to load CSS files","package":"css-loader","optional":false},{"reason":"injects CSS into DOM","package":"style-loader","optional":false},{"reason":"handles image assets","package":"file-loader","optional":true}],"imports":[{"note":"Default import is not supported; the entire module is side-effects only. Use bare import.","wrong":"import jQueryUI from 'webpack-jquery-ui'","symbol":"webpack-jquery-ui","correct":"import 'webpack-jquery-ui'"},{"note":"CSS import similarly is a side-effect; default import will be undefined.","wrong":"import css from 'webpack-jquery-ui/css'","symbol":"css","correct":"import 'webpack-jquery-ui/css'"},{"note":"Named exports not available. Use CommonJS require with subpath.","wrong":"import { interactions } from 'webpack-jquery-ui'","symbol":"interactions","correct":"require('webpack-jquery-ui/interactions')"}],"quickstart":{"code":"// install: npm install webpack-jquery-ui jquery\n// webpack.config.js\nconst path = require('path');\nconst webpack = require('webpack');\nmodule.exports = {\n  entry: './src/index.js',\n  output: {\n    filename: 'bundle.js',\n    path: path.resolve(__dirname, 'dist'),\n    publicPath: 'dist/'\n  },\n  module: {\n    rules: [\n      { test: /\\.css$/, use: ['style-loader', 'css-loader'] },\n      { test: /\\.(png|jpe?g|gif)$/i, use: 'file-loader' }\n    ]\n  },\n  plugins: [\n    new webpack.ProvidePlugin({\n      $: 'jquery',\n      jQuery: 'jquery',\n      'window.jQuery': 'jquery',\n      'window.$': 'jquery'\n    })\n  ]\n};\n// index.js\nrequire('webpack-jquery-ui');\nrequire('webpack-jquery-ui/css');\n$(function() {\n  $('#datepicker').datepicker();\n});","lang":"javascript","description":"Sets up full jQuery UI with webpack, including ProvidePlugin and CSS loading."},"warnings":[{"fix":"Evaluate alternative UI libraries or serve jQuery UI via script tags in HTML.","message":"webpack-jquery-ui is not actively maintained; consider migrating to modern frameworks like React/Vue or using jQuery UI CDN directly.","severity":"deprecated","affected_versions":"*"},{"fix":"Run 'npm install jquery' and ensure ProvidePlugin aliases are set in webpack config.","message":"The package does not include jQuery itself; you must install jquery separately as a dependency.","severity":"gotcha","affected_versions":"*"},{"fix":"Install 'npm install --save-dev style-loader css-loader file-loader'.","message":"Webpack 4+ requires style-loader and css-loader to be installed as dev dependencies; they are not automatically included by this package.","severity":"gotcha","affected_versions":">=2.0"},{"fix":"Update to latest jQuery UI patch or sanitize user input manually.","message":"jQuery UI v1.12.1 has known XSS vulnerabilities (CVE-2016-7103) in the dialog widget.","severity":"breaking","affected_versions":">=2.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Run 'npm install jquery' and add ProvidePlugin to webpack config.","cause":"jquery not installed as a dependency","error":"Error: Cannot find module 'jquery'"},{"fix":"Install 'npm install --save-dev style-loader css-loader' and add a rule for .css files in webpack config.","cause":"Missing style-loader or css-loader for CSS files","error":"Error: Module parse failed: Unexpected token (1:0) You may need an appropriate loader to handle this file type."},{"fix":"Ensure you have require('webpack-jquery-ui') in your entry file and wrap code in $(function() { ... }) or DOMContentLoaded event.","cause":"jQuery UI not properly loaded or initialized after DOM ready","error":"$(...).datepicker is not a function"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}