{"id":18817304,"url":"https://github.com/blueberryapps/react-load-script","last_synced_at":"2025-05-16T07:04:32.149Z","repository":{"id":4906453,"uuid":"57879374","full_name":"blueberryapps/react-load-script","owner":"blueberryapps","description":"React component that makes it easy to load 3rd party scripts","archived":false,"fork":false,"pushed_at":"2023-01-24T21:52:52.000Z","size":292,"stargazers_count":359,"open_issues_count":20,"forks_count":30,"subscribers_count":23,"default_branch":"master","last_synced_at":"2025-04-08T16:08:41.749Z","etag":null,"topics":["blueberry-opensource","javascript","loader","react","script"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/blueberryapps.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-05-02T09:46:18.000Z","updated_at":"2024-10-16T07:15:13.000Z","dependencies_parsed_at":"2023-02-14T01:40:23.891Z","dependency_job_id":null,"html_url":"https://github.com/blueberryapps/react-load-script","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blueberryapps%2Freact-load-script","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blueberryapps%2Freact-load-script/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blueberryapps%2Freact-load-script/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blueberryapps%2Freact-load-script/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/blueberryapps","download_url":"https://codeload.github.com/blueberryapps/react-load-script/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254485055,"owners_count":22078767,"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":["blueberry-opensource","javascript","loader","react","script"],"created_at":"2024-11-08T00:10:48.738Z","updated_at":"2025-05-16T07:04:32.133Z","avatar_url":"https://github.com/blueberryapps.png","language":"JavaScript","readme":"# react-load-script [![CircleCI](https://circleci.com/gh/blueberryapps/react-load-script.svg?style=svg)](https://circleci.com/gh/blueberryapps/react-load-script) [![Dependency Status](https://dependencyci.com/github/blueberryapps/react-load-script/badge)](https://dependencyci.com/github/blueberryapps/react-load-script)\nThis package simplifies loading of 3rd party scripts in your React applications.\n\n## Motivation\nThere are situations when you need to use a 3rd party JS library in your React application (jQuery, D3.js for rendering charts, etc.) but you don't need it everywhere and/or you want to use it only in a response to users actions. In cases like this, preloading the whole library when application starts is an unnecessary and expensive operation which could possibly slow down your application.\n\nUsing the `Script` component this package provides you with, you can easily load any 3rd party scripts your applications needs directly in a relevant component and show a placeholder while the script is loading (e.g. a loading animation). As soon as the script is fully loaded, a callback function you'll have passed to `Script` is called (see example below).\n\n## Supported React versions\nThis package requires React 0.14.9 and higher.\n\n## API\nThe package exports a single component with the following props:\n\n### `onCreate`\nCalled as soon as the script tag is created.\n\n### `onError` (required)\nCalled in case of an error with the script.\n\n### `onLoad` (required)\nCalled when the requested script is fully loaded.\n\n### `url` (required)\nURL pointing to the script you want to load.\n\n### `attributes`\nAn object used to define custom attributes to be set on the script element. For example, `attributes={{ id: 'someId', 'data-custom: 'value' }}` will result in `\u003cscript id=\"someId\" data-custom=\"value\" /\u003e`\n\n## Example\nYou can use the following code to load jQuery in your app:\n\n```jsx\nimport Script from 'react-load-script'\n\n...\n\nrender() {\n  return (\n    \u003cScript\n      url=\"https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js\"\n      onCreate={this.handleScriptCreate.bind(this)}\n      onError={this.handleScriptError.bind(this)}\n      onLoad={this.handleScriptLoad.bind(this)}\n    /\u003e\n  )\n}\n\n...\n\nhandleScriptCreate() {\n  this.setState({ scriptLoaded: false })\n}\n\nhandleScriptError() {\n  this.setState({ scriptError: true })\n}\n\nhandleScriptLoad() {\n  this.setState({ scriptLoaded: true })\n}\n\n```\n\n## License\nMIT 2016\n\n## Made with love by\n[![](https://camo.githubusercontent.com/d88ee6842f3ff2be96d11488aa0d878793aa67cd/68747470733a2f2f7777772e676f6f676c652e636f6d2f612f626c75656265727279617070732e636f6d2f696d616765732f6c6f676f2e676966)](https://www.blueberry.io)\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblueberryapps%2Freact-load-script","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fblueberryapps%2Freact-load-script","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblueberryapps%2Freact-load-script/lists"}