React Js注入（React未定义） [英] React Js inject (React is not defined)

问题描述

代码：

  var files = [
 
 {element：'script'，parameters：{src：chrome.extension.getURL（ui / react.min.js）}}，
 {元素：'script'，参数：{src：chrome.extension.getURL（ui / react-dom.min.js）}}，
 {element：'script'，parameters：{src：chrome。 extension.getURL（ui / popup.js）}}，
 
] 
 
（var i = 0; i< files.length; i ++）{
 file = files [i] 
 
 var e = document.createElement（file.element）; 
 
（file.parameters中的var j）{
 param = file.parameters [j]; 
 console.log（param）
 e [j] = param; 
} 
 document.head.appendChild（e）; 
} 
  

结果：文件注入成功，但出现错误（Uncaught ReferenceError：React is没有定义）当试图在popup.js中使用它时

解决方案

脚本不是同步注入的。考虑使用诸如webpack之类的东西，将它们捆绑成1件，并具有开箱即用的依赖管理功能（毕竟我们生活在2015年））

document.createElement（" script"）同步

作为参考

Why: For use react in chrome extension

Code:

var files = [

    {element: 'script', parameters: {src: chrome.extension.getURL("ui/react.min.js")}},
    {element: 'script', parameters: {src: chrome.extension.getURL("ui/react-dom.min.js")}},
    {element: 'script', parameters: {src: chrome.extension.getURL("ui/popup.js")}},

    ]

    for(var i=0; i < files.length; i++){
        file = files[i]

        var e = document.createElement(file.element);

        for(var j in file.parameters){
            param = file.parameters[j];
            console.log(param)
            e[j] = param;
        }
        document.head.appendChild(e);
    }

Result: files injected successfully, but I got error (Uncaught ReferenceError: React is not defined) when try to use it in popup.js

解决方案

Scripts are not injected synchronously. Consider using stuff like webpack, to bundle them into 1 piece with out-of-the-box dependency management(we are living in 2015, after all :))

see document.createElement("script") synchronously

as reference

这篇关于React Js注入（React未定义）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！