{"id":26146,"library":"react-async-loader","title":"react-async-loader","description":"Async script loading composition for React components, supporting jsonp and multiple script loading. Currently at version 0.1.2, with an API redesign in 0.1.0 that introduced mapScriptsToProps configuration. It provides a higher-order component to load external scripts (e.g., Google Maps) and inject them as props. Unlike libraries like react-loadable, it focuses on script injection rather than code splitting. Package has minimal dependencies: React >=0.13. Release cadence is low, with no newer versions since 2015.","status":"maintenance","version":"0.1.2","language":"javascript","source_language":"en","source_url":"https://github.com/EdStudio/react-async-loader","tags":["javascript","React","Async","Script Loader"],"install":[{"cmd":"npm install react-async-loader","lang":"bash","label":"npm"},{"cmd":"yarn add react-async-loader","lang":"bash","label":"yarn"},{"cmd":"pnpm add react-async-loader","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency for React components, version >=0.13 required.","package":"react","optional":false},{"reason":"Used internally to hoist static methods from wrapped component.","package":"hoist-non-react-statics","optional":false}],"imports":[{"note":"Default export; requires ESM or CommonJS transpilation.","wrong":"const asyncLoad = require('react-async-loader')","symbol":"asyncLoad","correct":"import asyncLoad from 'react-async-loader'"},{"note":"In CommonJS, the module.exports is the default export; using require without .default will not work in some bundlers.","wrong":"const asyncLoad = require('react-async-loader')","symbol":"asyncLoad (default)","correct":"const asyncLoad = require('react-async-loader').default"}],"quickstart":{"code":"import React from 'react';\nimport asyncLoad from 'react-async-loader';\n\nconst MyComponent = ({ loadedScript }) => (\n  <div>{loadedScript ? 'Script loaded' : 'Loading...'}</div>\n);\n\nconst mapScriptsToProps = (props) => ({\n  loadedScript: {\n    globalPath: 'myLib',\n    url: 'https://cdn.example.com/myLib.js',\n    jsonp: false\n  }\n});\n\nexport default asyncLoad(mapScriptsToProps)(MyComponent);","lang":"javascript","description":"Shows basic usage: wrap a component with asyncLoad to inject an external script as a prop."},"warnings":[{"fix":"Ensure the script sets a global variable matching the globalPath key.","message":"The script global path must exist on window after loading; otherwise the prop will be undefined.","severity":"gotcha","affected_versions":"*"},{"fix":"Consider using newer alternatives like react-loadable or @loadable/component for script loading.","message":"Package has not been updated since 2015; may not work with React >16 or modern build tools.","severity":"deprecated","affected_versions":"0.1.2"},{"fix":"Upgrade to 0.1.0+ and update usage to pass a function that returns config.","message":"API changed in version 0.1.0: mapScriptsToProps now receives props and returns a config object; previous API was different.","severity":"breaking","affected_versions":"<0.1.0"}],"env_vars":null,"search_vec":"'0.1.0':27 '0.1.2':21 '0.13':71 '2015':81 'api':24 'async':3,5,84 'cadenc':73 'code':64 'compon':11,38 'composit':8 'configur':31 'current':18 'depend':69 'e.g':43 'extern':41 'focus':58 'googl':44 'higher':36 'higher-ord':35 'inject':47,61 'introduc':29 'javascript':82 'jsonp':13 'librari':52 'like':53 'load':7,17,40 'loadabl':56 'loader':4,86 'low':75 'map':45 'mapscriptstoprop':30 'minim':68 'multipl':15 'newer':78 'order':37 'packag':66 'prop':50 'provid':33 'rather':62 'react':2,10,55,70,83 'react-async-load':1 'react-load':54 'redesign':25 'releas':72 'script':6,16,42,60,85 'sinc':80 'split':65 'support':12 'unlik':51 'version':20,79","created_at":"2026-05-01T13:48:26.016404+00:00","updated_at":"2026-05-01T13:48:26.016404+00:00","problems":[{"fix":"Use `const asyncLoad = require('react-async-loader').default;`","cause":"Using CommonJS require without .default when the module is an ES module default export.","error":"TypeError: Cannot read property 'default' of undefined"},{"fix":"Check that the script URL is accessible and the globalPath matches a property on window after loading.","cause":"The wrapped component is undefined because the script injection failed to load.","error":"Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined."},{"fix":"Ensure the script sets the expected global variable. Consider using jsonp: true if the script supports JSONP callbacks.","cause":"The script has not loaded before the component renders, or the global variable does not exist.","error":"Uncaught ReferenceError: someGlobal is not defined"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":"","cli_version":null,"type":"library","homepage":null,"github":"https://github.com/EdStudio/react-async-loader","docs":null,"changelog":null,"pypi":null,"npm":"https://www.npmjs.com/package/react-async-loader","openapi_spec":null,"status_page":null,"smithery":null,"categories":["web-framework"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-05-01","next_check":"2026-07-30","install_tag":null}}