use-script-loader
Advanced tools
+1
-3
@@ -1,3 +0,1 @@ | ||
| export declare function useScriptLoader(source: string, attrs?: object, node?: HTMLElement, skip?: boolean): { | ||
| isLoading: boolean; | ||
| }; | ||
| export declare function useScriptLoader(source: string, attrs?: object, node?: HTMLElement, skip?: boolean): {}[]; |
+12
-4
@@ -7,3 +7,5 @@ "use strict"; | ||
| function useScriptLoader(source, attrs, node, skip) { | ||
| var _a = react_1.useState(true), isLoading = _a[0], setIsLoading = _a[1]; | ||
| var _a = react_1.useState(true), loading = _a[0], setIsLoading = _a[1]; | ||
| var _b = react_1.useState({}), error = _b[0], setError = _b[1]; | ||
| var _c = react_1.useState({}), scriptReference = _c[0], setScriptReference = _c[1]; | ||
| react_1.useEffect(function () { | ||
@@ -19,4 +21,10 @@ var scripts = Array.from(document.scripts); | ||
| scriptLoader_1.default(source, attrs, node) | ||
| .then(function () { return setIsLoading(false); }) | ||
| .catch(function (e) { return console.error(e); }); | ||
| .then(function (script) { | ||
| setIsLoading(false); | ||
| setScriptReference(script); | ||
| }) | ||
| .catch(function (e) { | ||
| console.error(e); | ||
| setError(e); | ||
| }); | ||
| } | ||
@@ -27,4 +35,4 @@ else { | ||
| }, []); | ||
| return { isLoading: isLoading }; | ||
| return [loading, scriptReference, error]; | ||
| } | ||
| exports.useScriptLoader = useScriptLoader; |
+2
-1
| { | ||
| "name": "use-script-loader", | ||
| "version": "1.0.4", | ||
| "version": "1.1.0", | ||
| "description": "React.js script loader hook", | ||
@@ -44,2 +44,3 @@ "main": "lib/index.js", | ||
| "react": "^16.13.1", | ||
| "react-dom": "^16.13.1", | ||
| "ts-jest": "^26.3.0", | ||
@@ -46,0 +47,0 @@ "typescript": "^4.0.2" |
+7
-5
@@ -1,2 +0,3 @@ | ||
| # use-script-loader hook | ||
| # use-script-loader hook [](https://travis-ci.org/essaji/useScriptLoader) | ||
| Inspired by [scriptLoader2](https://github.com/feross/load-script2) | ||
@@ -14,7 +15,8 @@ ## install | ||
| const { isLoading } = useScriptLoader('foo.js') | ||
| const [loading, script, error] = useScriptLoader('foo.js') | ||
| if (loading) return <Spinner /> | ||
| if (error) throw error | ||
| console.log(script.src); // Prints 'foo'.js' | ||
| if (!isLoading) { | ||
| // use foo.js | ||
| } | ||
| // use foo.js | ||
| ``` | ||
@@ -21,0 +23,0 @@ |
6004
8.38%61
10.91%55
3.77%10
11.11%