如何在NPM模块中导出react-froala-wysiwyg编辑器?

时间:2018-07-17 03:18:06

标签: reactjs froala

此问题涉及react-froala-wysiwyg软件包。

我有一个npm模块,其中包含可重复使用的react组件,这些组件在多个项目中进行部署。

我刚刚将react-froala插入了我的程序包,它可以很好地呈现在故事书中,如下所示:

enter image description here

但是,当我从一个项目应用程序中调用该组件时,我得到了:

enter image description here

我在控制台中注意到以下错误。我该如何解决?

/Users/joel/Sites/node_modules/dist/index.js:30398
                __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)):"object"==typeof module&&module.exports?module.exports=function(e,t){return t===undefined&&(t="undefined"!=typeof window?require("jquery"):require("jquery")(e)),n(t)}:n(window.jQuery)}(function(be){var s=function(e,t){this.id=++be.FE.ID,this.opts=be.extend(!0,{},be.extend({},s.DEFAULTS,"object"==typeof t&&t));var n=JSON.stringify(this.opts);be.FE.OPTS_MAPPING[n]=be.FE.OPTS_MAPPING[n]||this.id,this.sid=be.FE.OPTS_MAPPING[n],be.FE.SHARED[this.sid]=be.FE.SHARED[this.sid]||{},this.shared=be.FE.SHARED[this.sid],this.shared.count=(this.shared.count||0)+1,this.$oel=be(e),this.$oel.data("froala.editor",this),this.o_doc=e.ownerDocument,this.o_win="defaultView"in this.o_doc?this.o_doc.defaultView:this.o_doc.parentWindow;var r=be(this.o_win).scrollTop();this.$oel.on("froala.doInit",be.proxy(function(){this.$oel.off("froala.doInit"),t

TypeError: Cannot set property 'froalaEditor' of undefined
    at Object.<anonymous> (/Users/joel/Sites/node_modules/dist/index.js:30398:5564)
    at t.id (/Users/joel/Sites/node_modules/dist/index.js:30397:37)
    at Object.<anonymous> (/Users/joel/Sites/node_modules/dist/index.js:30398:286)
    at __webpack_require__ (/Users/joel/Sites/node_modules/dist/index.js:30:30)
    at Object.<anonymous> (/Users/joel/Sites/node_modules/dist/index.js:30297:1)
    at __webpack_require__ (/Users/joel/Sites/node_modules/dist/index.js:30:30)
    at Object.<anonymous> (/Users/joel/Sites/node_modules/dist/index.js:29418:21)
    at __webpack_require__ (/Users/joel/Sites/node_modules/dist/index.js:30:30)
    at Object.defineProperty.value (/Users/joel/Sites/node_modules/dist/index.js:22870:27)
    at __webpack_require__ (/Users/joel/Sites/node_modules/dist/index.js:30:30)

1 个答案:

答案 0 :(得分:0)

已解决!事实证明,这个问题与每句话都说出的反应无关。导出已成功。问题是我的npm模块未捆绑必需的样式。我只需要更新我的webpack配置以使用extract-text-webpack-plugin,然后将输出的CSS文件导入我的下游项目中就可以了。祝你好运!