如何在Meteor JS中集成TinyMCE和CKEditor?
我想在我的项目中使用CKEditor或TinyMCE编辑器。 所以我把TinyMCE文件夹放在meteor公共文件夹中,也放了
<script type="text/javascript" src="/tinymce/tinymce.min.js"> tinymce.init({ selector: "textarea" });
在模板头标记。 但是收到以下错误。 资源解释为脚本但使用MIME类型text / html传输: "http://localhost:3000/%3Cyour%20installation%20path%3E/tinymce/tinymce.min.js". (index):97
"http://localhost:3000/%3Cyour%20installation%20path%3E/tinymce/tinymce.min.js". (index):97
Uncaught SyntaxError:意外的标记<tinymce.min.js:1未捕获的ReferenceError:未定义tinymce
我该如何解决这个问题? 它与CKEditor相同。 有没有其他丰富的编辑器,我可以在Meteor JS中使用它?
首先,您需要将CKEDITOR构建下载中的所有内容放在公用文件夹中。 CKEDITOR带有各种各样的东西,并根据相关目录引用所有内容。
您的公用文件夹应该有一个名为ckeditor的目录,它应包含以下文件和文件夹:
adapters lang plugins skins ckeditor.js config.js contents.css styles.js
在您的主要布局文件中引用CKEDITOR,如下所示:
在您的模板中:
最后,在模板的渲染function中:
Template.yourTemplate.rendered = function() { $('#content').ckeditor(); };
通常情况下,你会这样说this.$('#content').ckeditor()
但这不起作用,因为CKEDITOR在你的公共文件夹中。 因此,您需要对#content
元素进行全局引用。
而不是/public
文件夹,将您的文件放在/client/compatibility
。 然后在要使用它的模板中初始化它。
Template.editor.rendered = function() { tinymce.init({ selector: 'textarea' }); };
这是唯一搜索wysiwyg的结果:
https://github.com/mcrider/meteor-bootstrap-wysiwyg
meteor add mcrider:bootstrap-wysiwyg
看起来比CKEditor或TinyMCE简单一些,但也许这对你的项目来说没问题。