{"id":16982554,"url":"https://github.com/romancow/load-script","last_synced_at":"2026-05-19T06:32:45.690Z","repository":{"id":47832523,"uuid":"246337666","full_name":"romancow/load-script","owner":"romancow","description":"Promise-based method for dynamically loading scripts in browser with TypeScript support","archived":false,"fork":false,"pushed_at":"2022-07-21T03:40:05.000Z","size":50,"stargazers_count":0,"open_issues_count":2,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-01-26T18:34:52.653Z","etag":null,"topics":["async","browser","load","promise","script","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"isc","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/romancow.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-03-10T15:26:39.000Z","updated_at":"2020-06-25T18:16:19.000Z","dependencies_parsed_at":"2022-09-13T15:03:06.659Z","dependency_job_id":null,"html_url":"https://github.com/romancow/load-script","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/romancow%2Fload-script","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/romancow%2Fload-script/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/romancow%2Fload-script/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/romancow%2Fload-script/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/romancow","download_url":"https://codeload.github.com/romancow/load-script/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244887283,"owners_count":20526579,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["async","browser","load","promise","script","typescript"],"created_at":"2024-10-14T02:08:41.373Z","updated_at":"2026-05-19T06:32:40.655Z","avatar_url":"https://github.com/romancow.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# load-script\nPromise-based method for dynamically loading scripts in browser with TypeScript support\n\n\u003csup\u003e*Promises must be polyfilled if environment does not already support it.\u003c/sup\u003e\n\n## Installation\n\nAdd a scope mapping for the GitHub npm package manager by adding a `.npmrc` file with the line:\n```\n@romancow:registry=https://npm.pkg.github.com/\n```\n\nThen install the package:\n```\nnpm install @romancow/load-script\n```\nor\n```\nyarn add @romancow/load-script\n```\n\nMore info on using the GitHub npm package registry [here](https://help.github.com/en/articles/configuring-npm-for-use-with-github-package-registry#installing-a-package).\n\nOr just [download](https://github.com/romancow/load-script/releases/latest) it.\n\n## Usage\n\nImport it:\n```javascript\nimport loadScript from '@romancow/load-script'\n```\n\nOr use a traditional script tag:\n```html\n\u003cscript src=\"load-script.js\"\u003e\u003c/script\u003e\n```\n\nThen use `loadScript` as a function to load javascript at a given url:\n```javascript\nloadScript(\"some/js/lib.js\");\n```\n\nBy default it returns a promise that resolves to the correpsonding `HTMLScriptElement` after the script has loaded.\n```javascript\nconst scriptElement = await loadScript(\"some/js/lib.js\");\n```\nor\n```javascript\nloadScript(\"some/js/lib.js\").then(function () {\n\t// do stuff script needs to be loaded for\n});\n```\n\n### Options\n\nYou can also pass an options object as a second argument to the method.\nAll options are optional.\n```javascript\nloadScript(\"some/js/my-module.js\", { type: \"module\", async: true });\n```\n\nThere are several options that correspond directly to attributes that will be set on the created script element. More info on them [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#Attributes).\n- `async` (boolean)\n- `defer` (boolean)\n- `crossOrigin` (string)\n- `integrity` (string)\n- `noModule` (boolean)\n- `nonce` (string)\n- `referrerPolicy` (string)\n- `type` (string)\n\nAnd then a few more \"advanced\" options:\n\u003cdl\u003e\n\t\u003cdt\u003e\u003ccode\u003eparent\u003c/code\u003e (string | Element)\u003c/dt\u003e\n\t\u003cdd\u003eAn \u003ccode\u003eElement\u003c/code\u003e instance or query selector string to use as the parent element to append newly created script elements to. Default is the document's head element.\u003c/dd\u003e\n\t\u003cdt\u003e\u003ccode\u003eforce\u003c/code\u003e (boolean)\u003c/dt\u003e\n\t\u003cdd\u003eWhether to circumvent browser caching by appending a random query string to the url, \"forcing\" it to refresh when added. Default is false.\u003c/dd\u003e\n\t\u003cdt\u003e\u003ccode\u003eid\u003c/code\u003e (string)\u003c/dt\u003e\n\t\u003cdd\u003eId used for caching loaded scripts. Also applied as the id attribute to corresponding script elements.\u003cdd\u003e\n\t\u003cdt\u003e\u003ccode\u003ecache\u003c/code\u003e (boolean)\u003c/dt\u003e\n\t\u003cdd\u003eWhether to cache the promise for the given id or url, rather than adding a new script element for each one. Default is false.\u003c/dd\u003e\n\t\u003cdt\u003e\u003ccode\u003emap\u003c/code\u003e (string | Function)\u003c/dt\u003e\n\t\u003cdd\u003eA global variable or function dictating the resolved value of \u003ccode\u003eloadScript\u003c/code\u003e's returned promise. Unlike other options, this value will be evaluated each time \u003ccode\u003eloadScript\u003c/code\u003e is called, whether it's retrieved from cache or not. Will be the corresponding script's element by default.\u003cdd\u003e\n\u003c/dl\u003e\n\n```javascript\nconst $ = await loadScript(\"https://code.jquery.com/jquery-3.4.1.min.js\", {\n\tintegrity: \"sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=\",\n\tcrossOrigin: \"anonymous\",\n\tmap: function() { return jQuery.noConflict() }\n});\n```\n\n## License\n[ISC](https://opensource.org/licenses/ISC)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fromancow%2Fload-script","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fromancow%2Fload-script","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fromancow%2Fload-script/lists"}