在缩小文件中使用React-dom与RequireJS

我试图在充当独立库的缩小文件中通过RequireJS使用React + ReactDOM。在缩小文件中使用React-dom与RequireJS

我已经到了可以使用React（捆绑在缩小文件中）的地步，但是当试图使用ReactDOM时，一切都中断，我发现的可能原因是，尽管试图加载“require-dom “require会尝试导入文件”react-dom“而不是从缩小文件中加载代码。（其中实际包含反应）。

其实我正在使用grunt来预编译所有require文件。这里是我的咕噜requirejs配置：

requirejs: { 
    build: { 
    options: { 
     baseUrl: './build/', 
     paths: { 
     'jquery': '../bower_components/jquery/dist/jquery.min', 
     'react': '../bower_components/react/react.min', 
     'react-dom': '../bower_components/react/react-dom.min' 
     }, 
     include: ['main'], 
     out: 'dist/library.min.js', 
     optimize: 'uglify2' 
    } 
    } 
}

Main.js如下：

define(['jquery', 'react', 'react-dom'], function($, React, ReactDOM) { 
    return { 
    react: React, 
    reactDOM: ReactDOM, 
    } 
});

编译所有的代码与上述配置后，我将其包含在HTML文件，如下所示：

<html> 
    <head> 
    <script src="../bower_components/requirejs/require.js"></script> 
    <script src="index.js"></script> 
    </head> 
    <body></body> 
</html>

Index.js是requirejs文件如下：

requirejs.config({ 
    baseUrl: 'src', 
    paths: { 
    mylib: 'lib/dist/library.min.js' 
    } 
}); 

require(['mylib'], function(mylib) { 
    console.log(mylib); 
});

执行上面的代码时我收到的错误是以下内容：

require.js:1958 GET file:///D:/code/example/user/src/src/react-dom.js net::ERR_FILE_NOT_FOUND 
req.load @ require.js:1958 
load @ require.js:1682load @ require.js:832 
fetch @ require.js:822check @ require.js:854 
enable @ require.js:1173 
enable @ require.js:1554 
(anonymous function) @ require.js:1158 
(anonymous function) @ require.js:134 
each @ require.js:59enable @ require.js:1110 
init @ require.js:786(anonymous function) @ require.js:1457 

require.js:168 Uncaught Error: Script error for "react-dom"(…)

如果删除反应-DOM一切加载顺利。

到目前为止，我已经尝试了几件事情，因为导入React作为垫片，所以react-dom检测到全局React var，但那也没有奏效。

任何帮助将不胜感激，在此先感谢。

更新：Github repo with example code

更新2：的反应-DOM LIB一段时间的调试和精缩脚本我发现的主要方法被调用之前执行完毕后“定义（” react-dom'）“，因此问题解开为”如何让主脚本等待，直到定义'react-dom'的代码才被执行“。

来源

2016-11-19 Edgar Llorente

你有没有考虑过通过GitHub共享最简单的例子？ – prosti

感谢您的建议，我会尽快准备一个最简单的例子。 –

添加示例Github repo。 –

似乎与新版本的React 15.4.1（昨天刚刚发布）一样，这个问题解决了。在更新bower.json中的版本后再试一次！

来源

2016-11-24 11:32:38 user3429953

在缩小文件中使用React-dom与RequireJS

回答

相关问题