有没有办法使用webpack使用reactjs的cdn文件?
答
最后我想出了一个非常简单的答案
安装NPM推-JS,ES6-承诺,同构取并导入它作为
var Pusher=require('pusher-js');
var fetch=require('isomorphic-fetch');
require('es6-promise').polyfill();
答
可以使用反应 - 异步脚本加载器作为一个高阶组件这个:https://github.com/leozdgao/react-async-script-loader
通过NPM只要安装它:
npm install --save react-async-script-loader
然后将它导入和扩展组件需要带有scriptLoader的cdn javascripts为您的组件添加了您想要包含的url。
import scriptLoader from 'react-async-script-loader';
// Your component code:
class YourComponent extends React.Component {
render() {
return <p>{
this.props.isScriptLoadSucceed ? 'Scripts loaded.' : 'Loading...'
}</p>;
}
}
export default scriptLoader([
'https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js',
'https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.5/marked.min.js'
])(YourComponent);
这样,文件只在你真正需要它们的地方加载。一旦加载,它们不会再被包含(如果更新组件)。
装饰者(ES7)的语法也可以工作,如果你喜欢它,而不是HOC实现,这在项目README中有记录。
我的类已经扩展React.Component.So如何我是否将scriptloader扩展到同一个类中?我不认为它支持多重继承 –
HOC不是通常的类继承,所以即使从React.Component继承,也可以使用它。请参阅此处了解有关此模式的更多信息:http://*.com/documentation/reactjs/9819/higher-order-components。请注意,“export default scriptLoader”中没有扩展,它更像是一个传递YourComponent类的函数调用。 –
如果你可以写一个简短的代码片断它将失去很大的帮助。我卡住了 –