{"id":20097,"library":"highlight.js-async-webpack","title":"Highlight.js Async Webpack","description":"Wraps highlight.js language modules as async webpack chunks, enabling on-demand loading of syntax highlighting. Version 1.0.4 (latest) returns false on error. Provides `hljsBlock(dom, lang, callback)` for async highlighting. Minimal API, no peer dependencies. Only compatible with webpack due to dynamic require context. Not actively maintained; last release 5+ years ago.","status":"maintenance","version":"1.0.4","language":"javascript","source_language":"en","source_url":"https://github.com/CHENXCHEN/highlight.js-async-webpack","tags":["javascript","highlight.js","async","highlightjs"],"install":[{"cmd":"npm install highlight.js-async-webpack","lang":"bash","label":"npm"},{"cmd":"yarn add highlight.js-async-webpack","lang":"bash","label":"yarn"},{"cmd":"pnpm add highlight.js-async-webpack","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"ESM default import only; CommonJS require may return broken object","wrong":"const hljs = require('highlight.js-async-webpack')","symbol":"default","correct":"import hljs from 'highlight.js-async-webpack'"},{"note":"Callback is required; omitted callback will break async flow","wrong":"hljs.hljsBlock(dom, lang)","symbol":"hljsBlock","correct":"hljs.hljsBlock(dom, lang, callback)"},{"note":"Named export not available; must use default import","wrong":"import { hljsBlock } from 'highlight.js-async-webpack'","symbol":"hljsBlock","correct":"import hljs from 'highlight.js-async-webpack'; hljs.hljsBlock(...)"}],"quickstart":{"code":"import hljs from 'highlight.js-async-webpack';\n\nconst codeElement = document.querySelector('code.language-javascript');\nif (codeElement) {\n  hljs.hljsBlock(codeElement, 'javascript', () => {\n    console.log('Highlighting complete');\n  });\n}","lang":"javascript","description":"Demonstrates importing the package and invoking hljsBlock with a DOM element, language class, and callback."},"warnings":[{"fix":"Consider using highlight.js with dynamic imports directly, or use highlight.js official npm package.","message":"Package not updated since 2018; may not work with modern webpack (4/5) or Node.js versions.","severity":"deprecated","affected_versions":">=1.0.4"},{"fix":"Use only in webpack projects; for others, use highlight.js manual chunking.","message":"Requires webpack and a specific async chunk naming convention; not compatible with other bundlers.","severity":"breaking","affected_versions":">=0.0.0"},{"fix":"Always provide a callback function even if it's a no-op.","message":"The callback is mandatory; omitting it will cause the highlighting to never complete.","severity":"gotcha","affected_versions":">=1.0.2"},{"fix":"Ensure the required language files are present in the webpack build context.","message":"Language files must exist at runtime; package does not include all languages by default.","severity":"gotcha","affected_versions":">=0.0.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 highlight.js-async-webpack","cause":"Package not installed or not in node_modules.","error":"Cannot find module 'highlight.js-async-webpack'"},{"fix":"Use: import hljs from 'highlight.js-async-webpack' (default import)","cause":"Incorrect import (e.g., named import) or using require instead of import.","error":"TypeError: hljs.hljsBlock is not a function"},{"fix":"Check that the language name passed to hljsBlock matches an existing file like 'javascript' (not 'js').","cause":"Requested language file not available in the async chunk path.","error":"Error: Cannot find module './lang/xxx'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}