我创建了一个带有 index.html 的 React 应用程序，如下所示:
<!DOCTYPE html!>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="react-container"></div>
<script type="text/javascript" src="assets/bundle.js"></script>
</body>
</html>Index.html 引用 index.js(来自 bundle.js)，后者调用 ReactDOM.render 来呈现应用程序，如下所示:
import React from 'react'
import { render } from 'react-dom'
import App from './components/App'
import { Provider } from 'react-redux'
import configureStore from './redux/configureStore'
render(
<Provider store={configureStore()}>
<App />
</Provider>,
document.getElementById('react-container')
)到目前为止一切顺利。但我希望我的组件可以在其他 Web 应用程序中重用。那我需要做什么？
我想我不会在包中提供 index.html 或 index.js 文件？但是我应该如何在其他 Web 应用程序中引用该组件呢？我想我需要引用 bundle.js 文件，但是我如何指定导入？那巴别塔呢？还有 React 库？
因为我也在用 Redux，所以我需要一个 Provider，我需要配置一个 store。我应该在哪里做？
最佳答案
为了能够重用组件，您需要构建它以导出渲染函数。我认为 nwb 很适合你 https://github.com/insin/nwb/blob/master/docs/guides/ReactComponents.md#developing-react-components-and-libraries-with-nwb 通过这种方式，您可以构建一个导出全局变量的 UMD 模块以与您的脚本标记一起使用和/或将其发布到 npm
与其使用 ReactDOM 显式渲染它，不如让 index.js 导出一个组件。 例如:
export default props =>
<Provider store={configureStore()}>
<App />
</Provider>
然后让用户代码将其呈现给dom
ReactDOM.render(React.createElement(YourLibraryGlobalNameGeneratedFromNwb))
https://stackoverflow.com/questions/44295752/
相关文章：
excel - 如何根据时间应用 WorksheetFunction.CountIfs？
kubernetes - 如何使用 kubernetes 执行 docker diff 命令
reactjs - 从 create-react-app 发出构建文件
python-3.x - 无法将音频上传到 Telegram 错误请求 : failed to ge
Angular 2 - 如何将响应式(Reactive)表单元素动态绑定(bind)到事件？
amazon-web-services - 如何将多个域名路由到同一个 amazon S3 存储桶位
amazon-dynamodb - DynamoDB PutItem 然后 UpdateItem 与