1<!DOCTYPE html> 2<html lang="en"> 3<head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width"> 6 <meta name="nodejs.org:node-version" content="v14.19.1"> 7 <title>Modules: module API | Node.js v14.19.1 Documentation</title> 8 <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:400,700,400italic&display=fallback"> 9 <link rel="stylesheet" href="assets/style.css"> 10 <link rel="stylesheet" href="assets/hljs.css"> 11 <link rel="canonical" href="https://nodejs.org/api/module.html"> 12</head> 13<body class="alt apidoc" id="api-section-module"> 14 <div id="content" class="clearfix"> 15 <div id="column2" class="interior"> 16 <div id="intro" class="interior"> 17 <a href="/" title="Go back to the home page"> 18 Node.js 19 </a> 20 </div> 21 <ul> 22<li><a href="documentation.html" class="nav-documentation">About this documentation</a></li> 23<li><a href="synopsis.html" class="nav-synopsis">Usage and example</a></li> 24</ul> 25<hr class="line"> 26<ul> 27<li><a href="assert.html" class="nav-assert">Assertion testing</a></li> 28<li><a href="async_hooks.html" class="nav-async_hooks">Async hooks</a></li> 29<li><a href="buffer.html" class="nav-buffer">Buffer</a></li> 30<li><a href="addons.html" class="nav-addons">C++ addons</a></li> 31<li><a href="n-api.html" class="nav-n-api">C/C++ addons with Node-API</a></li> 32<li><a href="embedding.html" class="nav-embedding">C++ embedder API</a></li> 33<li><a href="child_process.html" class="nav-child_process">Child processes</a></li> 34<li><a href="cluster.html" class="nav-cluster">Cluster</a></li> 35<li><a href="cli.html" class="nav-cli">Command-line options</a></li> 36<li><a href="console.html" class="nav-console">Console</a></li> 37<li><a href="corepack.html" class="nav-corepack">Corepack</a></li> 38<li><a href="crypto.html" class="nav-crypto">Crypto</a></li> 39<li><a href="debugger.html" class="nav-debugger">Debugger</a></li> 40<li><a href="deprecations.html" class="nav-deprecations">Deprecated APIs</a></li> 41<li><a href="diagnostics_channel.html" class="nav-diagnostics_channel">Diagnostics Channel</a></li> 42<li><a href="dns.html" class="nav-dns">DNS</a></li> 43<li><a href="domain.html" class="nav-domain">Domain</a></li> 44<li><a href="errors.html" class="nav-errors">Errors</a></li> 45<li><a href="events.html" class="nav-events">Events</a></li> 46<li><a href="fs.html" class="nav-fs">File system</a></li> 47<li><a href="globals.html" class="nav-globals">Globals</a></li> 48<li><a href="http.html" class="nav-http">HTTP</a></li> 49<li><a href="http2.html" class="nav-http2">HTTP/2</a></li> 50<li><a href="https.html" class="nav-https">HTTPS</a></li> 51<li><a href="inspector.html" class="nav-inspector">Inspector</a></li> 52<li><a href="intl.html" class="nav-intl">Internationalization</a></li> 53<li><a href="modules.html" class="nav-modules">Modules: CommonJS modules</a></li> 54<li><a href="esm.html" class="nav-esm">Modules: ECMAScript modules</a></li> 55<li><a href="module.html" class="nav-module active">Modules: <code>module</code> API</a></li> 56<li><a href="packages.html" class="nav-packages">Modules: Packages</a></li> 57<li><a href="net.html" class="nav-net">Net</a></li> 58<li><a href="os.html" class="nav-os">OS</a></li> 59<li><a href="path.html" class="nav-path">Path</a></li> 60<li><a href="perf_hooks.html" class="nav-perf_hooks">Performance hooks</a></li> 61<li><a href="policy.html" class="nav-policy">Policies</a></li> 62<li><a href="process.html" class="nav-process">Process</a></li> 63<li><a href="punycode.html" class="nav-punycode">Punycode</a></li> 64<li><a href="querystring.html" class="nav-querystring">Query strings</a></li> 65<li><a href="readline.html" class="nav-readline">Readline</a></li> 66<li><a href="repl.html" class="nav-repl">REPL</a></li> 67<li><a href="report.html" class="nav-report">Report</a></li> 68<li><a href="stream.html" class="nav-stream">Stream</a></li> 69<li><a href="string_decoder.html" class="nav-string_decoder">String decoder</a></li> 70<li><a href="timers.html" class="nav-timers">Timers</a></li> 71<li><a href="tls.html" class="nav-tls">TLS/SSL</a></li> 72<li><a href="tracing.html" class="nav-tracing">Trace events</a></li> 73<li><a href="tty.html" class="nav-tty">TTY</a></li> 74<li><a href="dgram.html" class="nav-dgram">UDP/datagram</a></li> 75<li><a href="url.html" class="nav-url">URL</a></li> 76<li><a href="util.html" class="nav-util">Utilities</a></li> 77<li><a href="v8.html" class="nav-v8">V8</a></li> 78<li><a href="vm.html" class="nav-vm">VM</a></li> 79<li><a href="wasi.html" class="nav-wasi">WASI</a></li> 80<li><a href="worker_threads.html" class="nav-worker_threads">Worker threads</a></li> 81<li><a href="zlib.html" class="nav-zlib">Zlib</a></li> 82</ul> 83<hr class="line"> 84<ul> 85<li><a href="https://github.com/nodejs/node" class="nav-https-github-com-nodejs-node">Code repository and issue tracker</a></li> 86</ul> 87 </div> 88 89 <div id="column1" data-id="module" class="interior"> 90 <header> 91 <div class="header-container"> 92 <h1>Node.js v14.19.1 documentation</h1> 93 <button class="theme-toggle-btn" id="theme-toggle-btn" title="Toggle dark mode/light mode" aria-label="Toggle dark mode/light mode" hidden> 94 <svg xmlns="http://www.w3.org/2000/svg" class="icon dark-icon" height="24" width="24"> 95 <path fill="none" d="M0 0h24v24H0z" /> 96 <path d="M11.1 12.08c-2.33-4.51-.5-8.48.53-10.07C6.27 2.2 1.98 6.59 1.98 12c0 .14.02.28.02.42.62-.27 1.29-.42 2-.42 1.66 0 3.18.83 4.1 2.15A4.01 4.01 0 0111 18c0 1.52-.87 2.83-2.12 3.51.98.32 2.03.5 3.11.5 3.5 0 6.58-1.8 8.37-4.52-2.36.23-6.98-.97-9.26-5.41z"/> 97 <path d="M7 16h-.18C6.4 14.84 5.3 14 4 14c-1.66 0-3 1.34-3 3s1.34 3 3 3h3c1.1 0 2-.9 2-2s-.9-2-2-2z"/> 98 </svg> 99 <svg xmlns="http://www.w3.org/2000/svg" class="icon light-icon" height="24" width="24"> 100 <path d="M0 0h24v24H0z" fill="none" /> 101 <path d="M6.76 4.84l-1.8-1.79-1.41 1.41 1.79 1.79 1.42-1.41zM4 10.5H1v2h3v-2zm9-9.95h-2V3.5h2V.55zm7.45 3.91l-1.41-1.41-1.79 1.79 1.41 1.41 1.79-1.79zm-3.21 13.7l1.79 1.8 1.41-1.41-1.8-1.79-1.4 1.4zM20 10.5v2h3v-2h-3zm-8-5c-3.31 0-6 2.69-6 6s2.69 6 6 6 6-2.69 6-6-2.69-6-6-6zm-1 16.95h2V19.5h-2v2.95zm-7.45-3.91l1.41 1.41 1.79-1.8-1.41-1.41-1.79 1.8z"/> 102 </svg> 103 </button> 104 </div> 105 <div id="gtoc"> 106 <ul> 107 <li> 108 <a href="index.html">Index</a> 109 </li> 110 <li> 111 <a href="all.html">View on single page</a> 112 </li> 113 <li> 114 <a href="module.json">View as JSON</a> 115 </li> 116 117 <li class="version-picker"> 118 <a href="#">View another version <span>▼</span></a> 119 <ol class="version-picker"><li><a href="https://nodejs.org/docs/latest-v17.x/api/module.html">17.x</a></li> 120<li><a href="https://nodejs.org/docs/latest-v16.x/api/module.html">16.x <b>LTS</b></a></li> 121<li><a href="https://nodejs.org/docs/latest-v15.x/api/module.html">15.x</a></li> 122<li><a href="https://nodejs.org/docs/latest-v14.x/api/module.html">14.x <b>LTS</b></a></li> 123<li><a href="https://nodejs.org/docs/latest-v13.x/api/module.html">13.x</a></li> 124<li><a href="https://nodejs.org/docs/latest-v12.x/api/module.html">12.x <b>LTS</b></a></li></ol> 125 </li> 126 127 <li class="edit_on_github"><a href="https://github.com/nodejs/node/edit/master/doc/api/module.md">Edit on GitHub</a></li> 128 </ul> 129 </div> 130 <hr> 131 </header> 132 133 <details id="toc" open><summary>Table of contents</summary><ul> 134<li><a href="#module_modules_module_api">Modules: <code>module</code> API</a> 135<ul> 136<li><a href="#module_the_module_object">The <code>Module</code> object</a> 137<ul> 138<li><a href="#module_module_builtinmodules"><code>module.builtinModules</code></a></li> 139<li><a href="#module_module_createrequire_filename"><code>module.createRequire(filename)</code></a></li> 140<li><span class="stability_0"><a href="#module_module_createrequirefrompath_filename"><code>module.createRequireFromPath(filename)</code></a></span></li> 141<li><a href="#module_module_syncbuiltinesmexports"><code>module.syncBuiltinESMExports()</code></a></li> 142</ul> 143</li> 144<li><span class="stability_1"><a href="#module_source_map_v3_support">Source map v3 support</a></span> 145<ul> 146<li><a href="#module_module_findsourcemap_path"><code>module.findSourceMap(path)</code></a></li> 147<li><a href="#module_class_module_sourcemap">Class: <code>module.SourceMap</code></a> 148<ul> 149<li><a href="#module_new_sourcemap_payload"><code>new SourceMap(payload)</code></a></li> 150<li><a href="#module_sourcemap_payload"><code>sourceMap.payload</code></a></li> 151<li><a href="#module_sourcemap_findentry_linenumber_columnnumber"><code>sourceMap.findEntry(lineNumber, columnNumber)</code></a></li> 152</ul> 153</li> 154</ul> 155</li> 156</ul> 157</li> 158</ul></details> 159 160 <div id="apicontent"> 161 <h2>Modules: <code>module</code> API<span><a class="mark" href="#module_modules_module_api" id="module_modules_module_api">#</a></span></h2> 162 163<div class="api_metadata"> 164<span>Added in: v0.3.7</span> 165</div> 166<section><h3>The <code>Module</code> object<span><a class="mark" href="#module_the_module_object" id="module_the_module_object">#</a></span></h3> 167<ul> 168<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object" class="type"><Object></a></li> 169</ul> 170<p>Provides general utility methods when interacting with instances of 171<code>Module</code>, the <a href="modules.html#modules_the_module_object"><code>module</code></a> variable often seen in <a href="modules.html">CommonJS</a> modules. Accessed 172via <code>import 'module'</code> or <code>require('module')</code>.</p> 173<h4><code>module.builtinModules</code><span><a class="mark" href="#module_module_builtinmodules" id="module_module_builtinmodules">#</a></span></h4> 174<div class="api_metadata"> 175<span>Added in: v9.3.0, v8.10.0, v6.13.0</span> 176</div> 177<ul> 178<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type" class="type"><string[]></a></li> 179</ul> 180<p>A list of the names of all modules provided by Node.js. Can be used to verify 181if a module is maintained by a third party or not.</p> 182<p><code>module</code> in this context isn't the same object that's provided 183by the <a href="modules.html#modules_the_module_wrapper">module wrapper</a>. To access it, require the <code>Module</code> module:</p> 184 185<pre><input class="js-flavor-selector" type="checkbox" checked aria-label="Show modern ES modules syntax"><code class="language-js mjs"><span class="hljs-comment">// module.mjs</span> 186<span class="hljs-comment">// In an ECMAScript module</span> 187<span class="hljs-keyword">import</span> { builtinModules <span class="hljs-keyword">as</span> builtin } <span class="hljs-keyword">from</span> <span class="hljs-string">'module'</span>;</code><code class="language-js cjs"><span class="hljs-comment">// module.cjs</span> 188<span class="hljs-comment">// In a CommonJS module</span> 189<span class="hljs-keyword">const</span> builtin = <span class="hljs-built_in">require</span>(<span class="hljs-string">'module'</span>).<span class="hljs-property">builtinModules</span>;</code></pre> 190<h4><code>module.createRequire(filename)</code><span><a class="mark" href="#module_module_createrequire_filename" id="module_module_createrequire_filename">#</a></span></h4> 191<div class="api_metadata"> 192<span>Added in: v12.2.0</span> 193</div> 194<ul> 195<li><code>filename</code> <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type" class="type"><string></a> | <a href="url.html#url_the_whatwg_url_api" class="type"><URL></a> Filename to be used to construct the require 196function. Must be a file URL object, file URL string, or absolute path 197string.</li> 198<li>Returns: <a href="modules.html#modules_require_id" class="type"><require></a> Require function</li> 199</ul> 200<pre><code class="language-js mjs"><span class="hljs-keyword">import</span> { createRequire } <span class="hljs-keyword">from</span> <span class="hljs-string">'module'</span>; 201<span class="hljs-keyword">const</span> <span class="hljs-built_in">require</span> = <span class="hljs-title function_">createRequire</span>(<span class="hljs-keyword">import</span>.<span class="hljs-property">meta</span>.<span class="hljs-property">url</span>); 202 203<span class="hljs-comment">// sibling-module.js is a CommonJS module.</span> 204<span class="hljs-keyword">const</span> siblingModule = <span class="hljs-built_in">require</span>(<span class="hljs-string">'./sibling-module'</span>);</code></pre> 205<h4><code>module.createRequireFromPath(filename)</code><span><a class="mark" href="#module_module_createrequirefrompath_filename" id="module_module_createrequirefrompath_filename">#</a></span></h4> 206<div class="api_metadata"> 207<span>Added in: v10.12.0</span><span>Deprecated since: v12.2.0</span> 208</div> 209<p></p><div class="api_stability api_stability_0"><a href="documentation.html#documentation_stability_index">Stability: 0</a> - Deprecated: Please use <a href="#module_module_createrequire_filename"><code>createRequire()</code></a> instead.</div><p></p> 210<ul> 211<li><code>filename</code> <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type" class="type"><string></a> Filename to be used to construct the relative require 212function.</li> 213<li>Returns: <a href="modules.html#modules_require_id" class="type"><require></a> Require function</li> 214</ul> 215<pre><code class="language-js"><span class="hljs-keyword">const</span> { createRequireFromPath } = <span class="hljs-built_in">require</span>(<span class="hljs-string">'module'</span>); 216<span class="hljs-keyword">const</span> requireUtil = <span class="hljs-title function_">createRequireFromPath</span>(<span class="hljs-string">'../src/utils/'</span>); 217 218<span class="hljs-comment">// Require `../src/utils/some-tool`</span> 219requireUtil(<span class="hljs-string">'./some-tool'</span>);</code></pre> 220<h4><code>module.syncBuiltinESMExports()</code><span><a class="mark" href="#module_module_syncbuiltinesmexports" id="module_module_syncbuiltinesmexports">#</a></span></h4> 221<div class="api_metadata"> 222<span>Added in: v12.12.0</span> 223</div> 224<p>The <code>module.syncBuiltinESMExports()</code> method updates all the live bindings for 225builtin <a href="esm.html">ES Modules</a> to match the properties of the <a href="modules.html">CommonJS</a> exports. It 226does not add or remove exported names from the <a href="esm.html">ES Modules</a>.</p> 227<pre><code class="language-js"><span class="hljs-keyword">const</span> fs = <span class="hljs-built_in">require</span>(<span class="hljs-string">'fs'</span>); 228<span class="hljs-keyword">const</span> assert = <span class="hljs-built_in">require</span>(<span class="hljs-string">'assert'</span>); 229<span class="hljs-keyword">const</span> { syncBuiltinESMExports } = <span class="hljs-built_in">require</span>(<span class="hljs-string">'module'</span>); 230 231fs.<span class="hljs-property">readFile</span> = newAPI; 232 233<span class="hljs-keyword">delete</span> fs.<span class="hljs-property">readFileSync</span>; 234 235<span class="hljs-keyword">function</span> <span class="hljs-title function_">newAPI</span>(<span class="hljs-params"></span>) { 236 <span class="hljs-comment">// ...</span> 237} 238 239fs.<span class="hljs-property">newAPI</span> = newAPI; 240 241<span class="hljs-title function_">syncBuiltinESMExports</span>(); 242 243<span class="hljs-title function_">import</span>(<span class="hljs-string">'fs'</span>).<span class="hljs-title function_">then</span>(<span class="hljs-function">(<span class="hljs-params">esmFS</span>) =></span> { 244 <span class="hljs-comment">// It syncs the existing readFile property with the new value</span> 245 assert.<span class="hljs-title function_">strictEqual</span>(esmFS.<span class="hljs-property">readFile</span>, newAPI); 246 <span class="hljs-comment">// readFileSync has been deleted from the required fs</span> 247 assert.<span class="hljs-title function_">strictEqual</span>(<span class="hljs-string">'readFileSync'</span> <span class="hljs-keyword">in</span> fs, <span class="hljs-literal">false</span>); 248 <span class="hljs-comment">// syncBuiltinESMExports() does not remove readFileSync from esmFS</span> 249 assert.<span class="hljs-title function_">strictEqual</span>(<span class="hljs-string">'readFileSync'</span> <span class="hljs-keyword">in</span> esmFS, <span class="hljs-literal">true</span>); 250 <span class="hljs-comment">// syncBuiltinESMExports() does not add names</span> 251 assert.<span class="hljs-title function_">strictEqual</span>(esmFS.<span class="hljs-property">newAPI</span>, <span class="hljs-literal">undefined</span>); 252});</code></pre> 253</section><section><h3>Source map v3 support<span><a class="mark" href="#module_source_map_v3_support" id="module_source_map_v3_support">#</a></span></h3> 254<div class="api_metadata"> 255<span>Added in: v13.7.0, v12.17.0</span> 256</div> 257<p></p><div class="api_stability api_stability_1"><a href="documentation.html#documentation_stability_index">Stability: 1</a> - Experimental</div><p></p> 258<p>Helpers for interacting with the source map cache. This cache is 259populated when source map parsing is enabled and 260<a href="https://sourcemaps.info/spec.html#h.lmz475t4mvbx">source map include directives</a> are found in a modules' footer.</p> 261<p>To enable source map parsing, Node.js must be run with the flag 262<a href="cli.html#cli_enable_source_maps"><code>--enable-source-maps</code></a>, or with code coverage enabled by setting 263<a href="cli.html#cli_node_v8_coverage_dir"><code>NODE_V8_COVERAGE=dir</code></a>.</p> 264 265<pre><input class="js-flavor-selector" type="checkbox" checked aria-label="Show modern ES modules syntax"><code class="language-js mjs"><span class="hljs-comment">// module.mjs</span> 266<span class="hljs-comment">// In an ECMAScript module</span> 267<span class="hljs-keyword">import</span> { findSourceMap, <span class="hljs-title class_">SourceMap</span> } <span class="hljs-keyword">from</span> <span class="hljs-string">'module'</span>;</code><code class="language-js cjs"><span class="hljs-comment">// module.cjs</span> 268<span class="hljs-comment">// In a CommonJS module</span> 269<span class="hljs-keyword">const</span> { findSourceMap, <span class="hljs-title class_">SourceMap</span> } = <span class="hljs-built_in">require</span>(<span class="hljs-string">'module'</span>);</code></pre> 270<!-- Anchors to make sure old links find a target --> 271<p><a id="module_module_findsourcemap_path_error"></a></p> 272<h4><code>module.findSourceMap(path)</code><span><a class="mark" href="#module_module_findsourcemap_path" id="module_module_findsourcemap_path">#</a></span></h4> 273<div class="api_metadata"> 274<span>Added in: v13.7.0, v12.17.0</span> 275</div> 276<ul> 277<li><code>path</code> <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type" class="type"><string></a></li> 278<li>Returns: <a href="module.html#module_class_module_sourcemap" class="type"><module.SourceMap></a></li> 279</ul> 280<p><code>path</code> is the resolved path for the file for which a corresponding source map 281should be fetched.</p> 282<h4>Class: <code>module.SourceMap</code><span><a class="mark" href="#module_class_module_sourcemap" id="module_class_module_sourcemap">#</a></span></h4> 283<div class="api_metadata"> 284<span>Added in: v13.7.0, v12.17.0</span> 285</div> 286<h5><code>new SourceMap(payload)</code><span><a class="mark" href="#module_new_sourcemap_payload" id="module_new_sourcemap_payload">#</a></span></h5> 287<ul> 288<li><code>payload</code> <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object" class="type"><Object></a></li> 289</ul> 290<p>Creates a new <code>sourceMap</code> instance.</p> 291<p><code>payload</code> is an object with keys matching the <a href="https://sourcemaps.info/spec.html#h.mofvlxcwqzej">Source map v3 format</a>:</p> 292<ul> 293<li><code>file</code>: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type" class="type"><string></a></li> 294<li><code>version</code>: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type" class="type"><number></a></li> 295<li><code>sources</code>: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type" class="type"><string[]></a></li> 296<li><code>sourcesContent</code>: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type" class="type"><string[]></a></li> 297<li><code>names</code>: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type" class="type"><string[]></a></li> 298<li><code>mappings</code>: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type" class="type"><string></a></li> 299<li><code>sourceRoot</code>: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type" class="type"><string></a></li> 300</ul> 301<h5><code>sourceMap.payload</code><span><a class="mark" href="#module_sourcemap_payload" id="module_sourcemap_payload">#</a></span></h5> 302<ul> 303<li>Returns: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object" class="type"><Object></a></li> 304</ul> 305<p>Getter for the payload used to construct the <a href="#module_class_module_sourcemap"><code>SourceMap</code></a> instance.</p> 306<h5><code>sourceMap.findEntry(lineNumber, columnNumber)</code><span><a class="mark" href="#module_sourcemap_findentry_linenumber_columnnumber" id="module_sourcemap_findentry_linenumber_columnnumber">#</a></span></h5> 307<ul> 308<li><code>lineNumber</code> <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type" class="type"><number></a></li> 309<li><code>columnNumber</code> <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type" class="type"><number></a></li> 310<li>Returns: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object" class="type"><Object></a></li> 311</ul> 312<p>Given a line number and column number in the generated source file, returns 313an object representing the position in the original file. The object returned 314consists of the following keys:</p> 315<ul> 316<li>generatedLine: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type" class="type"><number></a></li> 317<li>generatedColumn: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type" class="type"><number></a></li> 318<li>originalSource: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type" class="type"><string></a></li> 319<li>originalLine: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type" class="type"><number></a></li> 320<li>originalColumn: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type" class="type"><number></a></li> 321<li>name: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type" class="type"><string></a></li> 322</ul></section> 323 <!-- API END --> 324 </div> 325 </div> 326 </div> 327 <script> 328 'use strict'; 329 { 330 const kCustomPreference = 'customDarkTheme'; 331 const userSettings = sessionStorage.getItem(kCustomPreference); 332 const themeToggleButton = document.getElementById('theme-toggle-btn'); 333 if (userSettings === null && window.matchMedia) { 334 const mq = window.matchMedia('(prefers-color-scheme: dark)'); 335 if ('onchange' in mq) { 336 function mqChangeListener(e) { 337 document.body.classList.toggle('dark-mode', e.matches); 338 } 339 mq.addEventListener('change', mqChangeListener); 340 if (themeToggleButton) { 341 themeToggleButton.addEventListener('click', function() { 342 mq.removeEventListener('change', mqChangeListener); 343 }, { once: true }); 344 } 345 } 346 if (mq.matches) { 347 document.body.classList.add('dark-mode'); 348 } 349 } else if (userSettings === 'true') { 350 document.body.classList.add('dark-mode'); 351 } 352 if (themeToggleButton) { 353 themeToggleButton.hidden = false; 354 themeToggleButton.addEventListener('click', function() { 355 sessionStorage.setItem( 356 kCustomPreference, 357 document.body.classList.toggle('dark-mode') 358 ); 359 }); 360 } 361 } 362 </script> 363</body> 364</html> 365