阵营组件require.default不确定

我已经建立了以下组件：阵营组件require.default不确定

import React from 'react'; 

const App =() => (

     <div className="wrapper"> 
      <h1>My App!!!!</h1> 
     </div> 

); 

export default App;

，而且我用react-hot-loader样板为：

import ReactDOM from 'react-dom'; 
import React from 'react'; 
import { AppContainer } from 'react-hot-loader'; 
import App from './component/App/app'; 

const dest = document.getElementById('content'); 

const render = (Component) => { 
    ReactDOM.render(
    <AppContainer> 
     <Component /> 
    </AppContainer>, 
    dest 
); 
}; 

render(App); 

if (module.hot) { 
    module.hot.accept('./component/App/app',() => { 
     const NextApp = require('./component/App/app').default; // eslint-disable-line global-require 


     console.log('====================================='); 
     console.log(NextApp); 
     render(NextApp); 
    }); 
}

加载页面是好的，但在更新应用程序组件后与一些不同的文本，HMR给错误重新加载页面：

[HMR] connected 
client.js?6a8d:199 [HMR] bundle rebuilding 
client.js?6a8d:207 [HMR] bundle rebuilt in 557ms 
process-update.js:27 [HMR] Checking for updates on the server... 
client.js:24 ===================================== 
client.js:25 undefined 
warning.js:36 Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in. 
printWarning @ warning.js:36 
warning @ warning.js:60 
createElement @ ReactElementValidator.js:171 
patchedCreateElement @ patch.dev.js:164 
render @ client.js:11 
(anonymous) @ client.js:26 
hotApply @ bootstrap a9a1805…:566 
cb @ process-update.js:52 
(anonymous) @ process-update.js:68 
process-update.js:115 [HMR] Cannot check for update (Full reload needed) 
handleError @ process-update.js:115 
applyCallback @ process-update.js:45 
process-update.js:116 [HMR] Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in. 
    at invariant (http://localhost:3001/dist/main-a9a1805da1160c9fe908.js:946:15) 
    at ReactCompositeComponentWrapper.instantiateReactComponent [as _instantiateReactComponent] (http://localhost:3001/dist/main-a9a1805da1160c9fe908.js:11215:55) 
    at ReactCompositeComponentWrapper._updateRenderedComponent (http://localhost:3001/dist/main-a9a1805da1160c9fe908.js:19850:24) 
    at ReactCompositeComponentWrapper._performComponentUpdate (http://localhost:3001/dist/main-a9a1805da1160c9fe908.js:19813:10) 
    at ReactCompositeComponentWrapper.updateComponent (http://localhost:3001/dist/main-a9a1805da1160c9fe908.js:19734:12) 
    at ReactCompositeComponentWrapper.receiveComponent (http://localhost:3001/dist/main-a9a1805da1160c9fe908.js:19636:10) 
    at Object.receiveComponent (http://localhost:3001/dist/main-a9a1805da1160c9fe908.js:3479:22) 
    at ReactCompositeComponentWrapper._updateRenderedComponent (http://localhost:3001/dist/main-a9a1805da1160c9fe908.js:19843:23) 
    at ReactCompositeComponentWrapper._performComponentUpdate (http://localhost:3001/dist/main-a9a1805da1160c9fe908.js:19813:10) 
    at ReactCompositeComponentWrapper.updateComponent (http://localhost:3001/dist/main-a9a1805da1160c9fe908.js:19734:12)

由于可以s在控制台日志中，NextApp正在返回undefined，所以render(NextApp)失败。

为什么const NextApp = require('...').default正在返回undefined？如何解决这个问题？

感谢您的帮助。

来源

2017-04-06 Mendes

您使用的是Webpack 2吗？您不应该再次执行require。您可以在accept回拨内再次拨打render(App)。请参阅here。

来源

2017-04-06 12:17:37 hazardous

什么暗示...是的，我使用的是Webpack 2，并且在漫游2天后解决了这个问题....谢谢！ – Mendes

☺很高兴知道它有帮助。 – hazardous

阵营组件require.default不确定

回答

相关问题