{"_id":"markdown-it-html5-media","_rev":"4540482","name":"markdown-it-html5-media","description":"Lightweight support for HTML5 video/audio using markdown image syntax","dist-tags":{"latest":"0.8.0"},"maintainers":[{"name":"eloquence","email":"eloquence@gmail.com"}],"time":{"modified":"2026-04-09T15:39:30.000Z","created":"2017-11-16T02:18:17.241Z","0.8.0":"2025-10-13T00:31:14.280Z","0.7.1":"2022-01-30T06:23:59.368Z","0.7.0":"2020-12-14T09:16:08.594Z","0.6.0":"2017-11-17T00:34:34.459Z","0.5.0":"2017-11-16T02:18:17.241Z"},"users":{},"author":{"name":"Erik Moeller","email":"eloquence@gmail.com","url":"https://twitter.com/xirzon"},"repository":{"type":"git","url":"git+https://github.com/eloquence/markdown-it-html5-media.git"},"versions":{"0.8.0":{"name":"markdown-it-html5-media","version":"0.8.0","description":"Lightweight support for HTML5 video/audio using markdown image syntax","repository":{"type":"git","url":"git+https://github.com/eloquence/markdown-it-html5-media.git"},"main":"lib/index.js","scripts":{"test":"mocha","docs":"jsdoc -r lib/ -c jsdocConf.json -d docs/","babel":"babel lib -d build","bundle":"browserify build/index.js --standalone html5Media -o build/markdown-it-html5-media.js","uglify":"uglifyjs build/markdown-it-html5-media.js -o build/markdown-it-html5-media.min.js","build":"npm run babel && npm run bundle && npm run uglify","dist":"npm run build && cp build/markdown-it-html5-media.* dist/"},"keywords":["markdown-it-plugin","markdown-it"],"author":{"name":"Erik Moeller","email":"eloquence@gmail.com","url":"https://twitter.com/xirzon"},"license":"CC0-1.0","peerDependencies":{"markdown-it":">=13 <15"},"devDependencies":{"@babel/cli":"^7.12.10","@babel/core":"^7.12.10","@babel/preset-env":"^7.12.10","browserify":"^17.0.0","jsdoc":"^3.6.10","markdown-it-testgen":"^0.1.6","markdown-it":"^14.1.0","mocha":"^9.2.0","uglify-js":"^3.12.1"},"engines":{"node":">=20.0.0"},"_id":"markdown-it-html5-media@0.8.0","gitHead":"9aec74613304fe0d96d8f7e88928b6edbbdc149b","bugs":{"url":"https://github.com/eloquence/markdown-it-html5-media/issues"},"homepage":"https://github.com/eloquence/markdown-it-html5-media#readme","_nodeVersion":"22.19.0","_npmVersion":"10.9.3","dist":{"shasum":"1c6e33c81220171e28e7ec564b082b3b0702978f","size":401764,"noattachment":false,"key":"/markdown-it-html5-media/-/markdown-it-html5-media-0.8.0.tgz","tarball":"http://registry.cnpm.dingdandao.com/markdown-it-html5-media/download/markdown-it-html5-media-0.8.0.tgz"},"_npmUser":{"name":"eloquence","email":"eloquence@gmail.com"},"directories":{},"maintainers":[{"name":"eloquence","email":"eloquence@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/markdown-it-html5-media_0.8.0_1760315474017_0.7687835889233661"},"_hasShrinkwrap":false,"_cnpmcore_publish_time":"2025-10-13T00:31:14.280Z","publish_time":1760315474280,"_source_registry_name":"default","_cnpm_publish_time":1760315474280},"0.7.1":{"name":"markdown-it-html5-media","version":"0.7.1","description":"Lightweight support for HTML5 video/audio using markdown image syntax","repository":{"type":"git","url":"git+https://github.com/eloquence/markdown-it-html5-media.git"},"main":"lib/index.js","scripts":{"test":"mocha","docs":"jsdoc -r lib/ -c jsdocConf.json -d docs/","babel":"babel lib -d build","bundle":"browserify build/index.js --standalone html5Media -o build/markdown-it-html5-media.js","uglify":"uglifyjs build/markdown-it-html5-media.js -o build/markdown-it-html5-media.min.js","build":"npm run babel && npm run bundle && npm run uglify","dist":"npm run build && cp build/markdown-it-html5-media.* dist/"},"keywords":["markdown-it-plugin","markdown-it"],"author":{"name":"Erik Moeller","email":"eloquence@gmail.com","url":"https://twitter.com/xirzon"},"license":"CC0-1.0","dependencies":{"markdown-it":"^12.3.2"},"devDependencies":{"@babel/cli":"^7.12.10","@babel/core":"^7.12.10","@babel/preset-env":"^7.12.10","browserify":"^17.0.0","jsdoc":"^3.6.10","markdown-it-testgen":"^0.1.6","mocha":"^9.2.0","uglify-js":"^3.12.1"},"engines":{"node":">=10.0"},"gitHead":"7f7b81149fc3d66847afb4ee62cc555284ac7221","bugs":{"url":"https://github.com/eloquence/markdown-it-html5-media/issues"},"homepage":"https://github.com/eloquence/markdown-it-html5-media#readme","_id":"markdown-it-html5-media@0.7.1","_nodeVersion":"14.18.3","_npmVersion":"6.14.15","dist":{"shasum":"14aab862c3681af65d66c18709eeecd3cb992bbc","size":408109,"noattachment":false,"key":"/markdown-it-html5-media/-/markdown-it-html5-media-0.7.1.tgz","tarball":"http://registry.cnpm.dingdandao.com/markdown-it-html5-media/download/markdown-it-html5-media-0.7.1.tgz"},"_npmUser":{"name":"eloquence","email":"eloquence@gmail.com"},"directories":{},"maintainers":[{"name":"eloquence","email":"eloquence@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/markdown-it-html5-media_0.7.1_1643523839165_0.21107244321893215"},"_hasShrinkwrap":false,"_cnpmcore_publish_time":"2022-01-30T06:24:05.042Z","publish_time":1643523839368,"_cnpm_publish_time":1643523839368},"0.7.0":{"name":"markdown-it-html5-media","version":"0.7.0","description":"Lightweight support for HTML5 video/audio using markdown image syntax","repository":{"type":"git","url":"git+https://github.com/eloquence/markdown-it-html5-media.git"},"main":"lib/index.js","scripts":{"test":"mocha","docs":"jsdoc -r lib/ -c jsdocConf.json -d docs/","babel":"babel lib -d build","bundle":"browserify build/index.js --standalone html5Media -o build/markdown-it-html5-media.js","uglify":"uglifyjs build/markdown-it-html5-media.js -o build/markdown-it-html5-media.min.js","build":"npm run babel && npm run bundle && npm run uglify","dist":"npm run build && cp build/markdown-it-html5-media.* dist/"},"keywords":["markdown-it-plugin","markdown-it"],"author":{"name":"Erik Moeller","email":"eloquence@gmail.com","url":"https://twitter.com/xirzon"},"license":"CC0-1.0","dependencies":{"markdown-it":"^12.0.3"},"devDependencies":{"@babel/cli":"^7.12.10","@babel/core":"^7.12.10","@babel/preset-env":"^7.12.10","browserify":"^17.0.0","jsdoc":"^3.6.6","markdown-it-testgen":"^0.1.6","mocha":"^8.2.1","uglify-js":"^3.12.1"},"engines":{"node":">=10.0"},"gitHead":"3af72a9d37af28f8a57cee734656ce2103ad6782","bugs":{"url":"https://github.com/eloquence/markdown-it-html5-media/issues"},"homepage":"https://github.com/eloquence/markdown-it-html5-media#readme","_id":"markdown-it-html5-media@0.7.0","_nodeVersion":"12.20.0","_npmVersion":"6.14.8","dist":{"shasum":"b6c0791676b706f4f7d7aa43ebbf8079aacea174","size":408077,"noattachment":false,"key":"/markdown-it-html5-media/-/markdown-it-html5-media-0.7.0.tgz","tarball":"http://registry.cnpm.dingdandao.com/markdown-it-html5-media/download/markdown-it-html5-media-0.7.0.tgz"},"_npmUser":{"name":"eloquence","email":"eloquence@gmail.com"},"directories":{},"maintainers":[{"name":"eloquence","email":"eloquence@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/markdown-it-html5-media_0.7.0_1607937368412_0.169924717039327"},"_hasShrinkwrap":false,"publish_time":1607937368594,"_cnpm_publish_time":1607937368594,"_cnpmcore_publish_time":"2021-12-17T06:23:15.098Z"},"0.6.0":{"name":"markdown-it-html5-media","version":"0.6.0","description":"Lightweight support for HTML5 video/audio using markdown image syntax","repository":{"type":"git","url":"git+https://github.com/eloquence/markdown-it-html5-media.git"},"main":"lib/index.js","scripts":{"test":"mocha","docs":"jsdoc -r lib/ -c jsdocConf.json -d docs/","babel":"babel lib -d build","bundle":"browserify build/index.js --standalone html5Media -o build/markdown-it-html5-media.js","uglify":"uglifyjs build/markdown-it-html5-media.js -o build/markdown-it-html5-media.min.js","build":"npm run babel && npm run bundle && npm run uglify","dist":"npm run build && cp build/markdown-it-html5-media.* dist/"},"keywords":["markdown-it-plugin","markdown-it"],"author":{"name":"Erik Moeller","email":"eloquence@gmail.com","url":"https://twitter.com/xirzon"},"license":"CC0-1.0","dependencies":{"markdown-it":"^8.4.0"},"devDependencies":{"babel-cli":"^6.26.0","babel-preset-env":"^1.6.1","browserify":"^14.5.0","jsdoc":"^3.5.5","markdown-it-testgen":"^0.1.4","mocha":"^4.0.1","uglify-js":"^3.1.9"},"engines":{"node":">=6.0"},"gitHead":"1b695182f2d1239de6d7d6d9ae88a0e4e479a69a","bugs":{"url":"https://github.com/eloquence/markdown-it-html5-media/issues"},"homepage":"https://github.com/eloquence/markdown-it-html5-media#readme","_id":"markdown-it-html5-media@0.6.0","_npmVersion":"5.5.1","_nodeVersion":"8.9.0","_npmUser":{"name":"eloquence","email":"eloquence@gmail.com"},"dist":{"shasum":"ed82bbdaec0545ba0879f0454c5a9d73171d3a76","size":438047,"noattachment":false,"key":"/markdown-it-html5-media/-/markdown-it-html5-media-0.6.0.tgz","tarball":"http://registry.cnpm.dingdandao.com/markdown-it-html5-media/download/markdown-it-html5-media-0.6.0.tgz"},"maintainers":[{"name":"eloquence","email":"eloquence@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/markdown-it-html5-media-0.6.0.tgz_1510878874282_0.624733972363174"},"directories":{},"publish_time":1510878874459,"_hasShrinkwrap":false,"_cnpm_publish_time":1510878874459,"_cnpmcore_publish_time":"2021-12-17T06:23:16.287Z"},"0.5.0":{"name":"markdown-it-html5-media","version":"0.5.0","description":"Lightweight support for HTML5 video/audio using markdown image syntax","repository":{"type":"git","url":"git+https://github.com/eloquence/markdown-it-html5-media.git"},"main":"lib/index.js","scripts":{"test":"mocha","docs":"jsdoc -r lib/ -c jsdocConf.json -d docs/","babel":"babel lib -d build","bundle":"browserify build/index.js --standalone html5Media -o build/markdown-it-html5-media.js","uglify":"uglifyjs build/markdown-it-html5-media.js -o build/markdown-it-html5-media.min.js","build":"npm run babel && npm run bundle && npm run uglify","dist":"npm run build && cp build/markdown-it-html5-media.* dist/"},"keywords":["markdown-it-plugin","markdown-it"],"author":{"name":"Erik Moeller","email":"eloquence@gmail.com","url":"https://twitter.com/xirzon"},"license":"CC0-1.0","dependencies":{"markdown-it":"^8.4.0"},"devDependencies":{"babel-cli":"^6.26.0","babel-preset-env":"^1.6.1","browserify":"^14.5.0","jsdoc":"^3.5.5","markdown-it-testgen":"^0.1.4","mocha":"^4.0.1","uglify-js":"^3.1.9"},"engines":{"node":">=6.0"},"gitHead":"3f2cfa9ba5efb7429fe1cfc7c185332947ee04e5","bugs":{"url":"https://github.com/eloquence/markdown-it-html5-media/issues"},"homepage":"https://github.com/eloquence/markdown-it-html5-media#readme","_id":"markdown-it-html5-media@0.5.0","_npmVersion":"5.5.1","_nodeVersion":"8.9.0","_npmUser":{"name":"eloquence","email":"eloquence@gmail.com"},"dist":{"shasum":"9e6f08a5abba331fc0d9d8d6e4f3e1659fd90562","size":437497,"noattachment":false,"key":"/markdown-it-html5-media/-/markdown-it-html5-media-0.5.0.tgz","tarball":"http://registry.cnpm.dingdandao.com/markdown-it-html5-media/download/markdown-it-html5-media-0.5.0.tgz"},"maintainers":[{"name":"eloquence","email":"eloquence@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/markdown-it-html5-media-0.5.0.tgz_1510798695987_0.18530756421387196"},"directories":{},"publish_time":1510798697241,"_hasShrinkwrap":false,"_cnpm_publish_time":1510798697241,"_cnpmcore_publish_time":"2021-12-17T06:23:17.191Z"}},"readme":"# markdown-it-html5-media\n![](https://travis-ci.org/eloquence/markdown-it-html5-media.svg?branch=master)\n\nMinimalist &lt;video>/&lt;audio> plugin for markdown-it, using image syntax.\n\nInspired by [markdown-it-html5-embed](https://github.com/cmrd-senya/markdown-it-html5-embed).\nKey differences:\n\n- Only supports image syntax: `![descriptive text](video.mp4)`, which is what\n  the CommonMark folks [seem to favor](https://talk.commonmark.org/t/embedded-audio-and-video/)\n- Tokenizes video and audio to tokens of the 'video' and 'audio' type (useful\n  for working with, e.g., rich text editors that process these tokens)\n- No library dependency for file type detection, just a simple extension check\n  for commonly used video/audio formats.\n- Transpiled version: 10KB unminified vs. 169KB unminified\n\n## Basic usage\n\n````javascript\nconst md = require('markdown-it')();\n// Destructuring assignment; we also export UI messages & media type detection\nconst { html5Media } = require('markdown-it-html5-media');\nmd.use(html5Media);\nconsole.log(md.render('![text](video.mp4)'));\n````\n\nOutput:\n\n````html\n<p><video src=\"video.mp4\" controls class=\"html5-video-player\">\nYour browser does not support playing HTML5 video.\nYou can <a href=\"video.mp4\" download>download the file</a> instead.\nHere is a description of the content: text\n</video></p>\n````\n\n## Custom attributes\n\nYou can pass any string that will be rendered instead of the default attributes shown above.\n\n````javascript\n// Init as above\nmd.use(html5Media, {\n  videoAttrs: 'class=\"my-video-css\"',\n  audioAttrs: 'class=\"my-audio-css\" data-collapse'\n});\nconsole.log(md.render('![](video.mp4)'));\nconsole.log(md.render('![](audio.mp3)'));\n````\n\nOutput:\n\n````html\n<p><video src=\"video.mp4\" class=\"my-video-css\">\nYour browser does not support playing HTML5 video.\nYou can <a href=\"video.mp4\" download>download the file</a> instead.\n</video></p>\n<p><audio src=\"audio.mp3\" class=\"my-audio-css\" data-collapse>\nYour browser does not support playing HTML5 audio.\nYou can <a href=\"audio.mp3\" download>download the file</a> instead.\n</audio></p>\n````\n\n## Media type detection\n\nThis module detects the media type by examining the file extension\n(case-insensitive). The valid audio and video extensions are defined\n[here](https://eloquence.github.io/markdown-it-html5-media/index.js.html#line15).\n\nIf you need to perform an identical media type detection outside the module,\nyou can import the `guessMediaType` function\n([docs](https://eloquence.github.io/markdown-it-html5-media/HTML5Media.html#.guessMediaType)):\n\n````javascript\nconst { guessMediaType } = require('markdown-it-html5-media');\n````\n\n## Custom messages\n\nYou can customize the fallback text. This text will only be shown to users whose browser does not support HTML5 video or audio at all. %s is used as a substitution marker for the filename or the description.\n\n````javascript\n// Init as above\nmd.use(html5Media, {\n  messages: {\n    en: {\n      'html5 video not supported':\n        'Cannot play video.',\n      'html5 audio not supported':\n        'Cannot play audio.',\n      'html5 media fallback link':\n        'Download <a href=\"%s\">file</a>.',\n      'html5 media description':\n        'Description: %s'      \n    }\n  }\n});\nconsole.log(md.render('![text](video.mp4)'));\n````\n\nOutput:\n\n````html\n<p><video src=\"video.mp4\" controls class=\"html5-video-player\">\nCannot play video.\nDownload <a href=\"video.mp4\">file</a>.\nDescription: text\n</video></p>\n````\n\nIf you only want to change some of the text, you can import the `messages`\nobject from the module and partially alter its contents:\n\n````javascript\nconst { html5Media, messages } = require('markdown-it-html5-media');\nmessages.en['html5 vide not supported'] = 'Cannot play video.';\n````\n\n## Translation\n\nMarkdown-It supports passing along environment options, like so:\n\n````javascript\nmd.render('![some text](video.mp4)', {\n  language: 'en'\n});\n````\n\nThis library will look up messages using the  `language` key as in the example provided, or `'en'` if none is provided. Only English messages are included with the library, and the built-in translation function falls back to English if a translation cannot be found.\n\nYou can provide additional translations using the approach in the previous example, or you can override the internal translation function, like so:\n\n````javascript\nmd.use(html5Media, { translateFn: someFunction });\n````\n\nFunction documentation:\n\n````javascript\n/**\n * @param {String} language\n *  a language code, typically an ISO 639-[1-3] code.\n * @param {String} messageKey\n *  an identifier for the message, typically a short descriptive text\n * @param {String[]} messageParams\n *  Strings to be substituted into the message using some pattern, e.g., %s or\n *  %1$s, %2$s. By default we only use a simple %s pattern.\n * @returns {String}\n *  the translation to use\n */\nfunction translateFn(language, messageKey, messageParams) {\n  // Your code here\n}\n````\n\n## Anything else?\n\nThe module is written in modern JavaScript. The version in `dist/` is transpiled\ndown to ES5 compatible with recent browsers. Use `npm run build` to update the\nbuild (does not change contents of `dist`; use `npm run dist` to build & dist).\n\nYou can find the automatically generated documentation [here](https://eloquence.github.io/markdown-it-html5-media/HTML5Media.html).\nUse `npm run docs` to regenerate it (changes contents of `docs`, which is\ntracked).\n\nThis library overrides Markdown-It's image tokenizer, which means that it\nduplicates portions of that particular Markdown-It code. If you can think of a\nbetter way to do what it does without scanning the whole token stream, please go\nahead and file an issue or send a PR.\n\nStrings should be escaped where they ought to be, but see the provided tests\nfor yourself. Use at your own risk. :)\n","_attachments":{},"homepage":"https://github.com/eloquence/markdown-it-html5-media#readme","bugs":{"url":"https://github.com/eloquence/markdown-it-html5-media/issues"},"license":"CC0-1.0"}