如何在Meteor JS中集成TinyMCE和CKEditor？

我想在我的項目中使用CKEditor或TinyMCE編輯器。所以我把TinyMCE的文件夾中的流星公用文件夾，也把如何在Meteor JS中集成TinyMCE和CKEditor？

<head> 
<script type="text/javascript" src="<your installation path>/tinymce/tinymce.min.js"></script> 
<script type="text/javascript"> 
    tinymce.init({ 
     selector: "textarea" 
    }); 
</script>

模板頭標記。但是接收到以下錯誤。資源解釋爲腳本，但使用MIME類型text/html轉移："http://localhost:3000/%3Cyour%20installation%20path%3E/tinymce/tinymce.min.js". (index):97 未捕獲的SyntaxError：意外的標記< tinymce.min.js：1 未捕獲的ReferenceError：TinyMCE的是沒有定義

我該如何解決這個問題？ CKEditor也一樣。有沒有其他豐富的編輯器，我可以在Meteor JS中使用？

來源

2014-09-24 zevsuld

下面是如何集成Aloha編輯器在流星，也許它可以幫助：http://stackoverflow.com/questions/13961737/using-meteor-with-requirejs/26315457#26315457 – steph643 2014-10-11 14:10:13

首先，您需要將公共文件夾中的CKEDITOR構建下載的所有內容。 CKEDITOR帶有各種各樣的東西，並引用基於相關目錄的所有東西。

公共文件夾應該有一個命名的CKEditor它目錄應包含包含下列文件和文件夾：

adapters 
lang 
plugins 
skins 
ckeditor.js 
config.js 
contents.css 
styles.js

在您的主要佈局文件引用CKEDITOR像這樣：

<head> 
    <script type="text/javascript" src="/ckeditor/ckeditor.js"></script> 
    <script type="text/javascript" src="/ckeditor/adapters/jquery.js"></script> 
</head>

在模板：

<template name="yourTemplate"> 
    <textarea id="content" name="content"></textarea> 
</template>

最後，在你的temp的渲染函數晚：

Template.yourTemplate.rendered = function() { 
    $('#content').ckeditor(); 
};

通常情況下，你會說this.$('#content').ckeditor()但是，這並不工作，因爲CKEDITOR是在公共文件夾。因此，您需要全局引用#content元素。

來源

2014-09-26 12:39:16 Brandon

布蘭登非常感謝你！它完美地工作，再次感謝您的溫柔回答。 – zevsuld 2014-09-29 00:30:35

而不是/public文件夾，把你的文件在/client/compatibility。然後在您想要使用它的模板中初始化它。

Template.editor.rendered = function() { 
    tinymce.init({ 
    selector: 'textarea' 
    }); 
};

來源

2014-09-24 07:41:23

我試過了。當我把客戶端/兼容性文件夾給它「客戶端/兼容性/ tinymce/js/tinymce /插件/ example/dialog.html：1：不能在這裏設置DOCTYPE（爲你流星設置<！DOCTYPE html> 。 – zevsuld 2014-09-24 08:24:25

我把它放在/公共文件夾中，然後如你所說在模板中初始化它。結果我tinymce未定義錯誤消失，現在只有未捕獲SyntaxError：意外的令牌 zevsuld 2014-09-24 08:32:45

DOCTYPE錯誤是由示例HTML您也放置在該文件夾中的文件。您應該只放分佈.js文件。 – 2014-09-24 09:28:20

這是唯一的結果搜索所見即所得：

https://github.com/mcrider/meteor-bootstrap-wysiwyg

meteor add mcrider:bootstrap-wysiwyg

看起來比CKEditor的或TinyMCE的簡單一些，但也許這是確定爲您的項目。

來源

2014-09-24 08:18:28 user54580

它非常簡單，但我需要編輯器作爲tinyeditor功能。無論如何感謝您的建議。 – zevsuld 2014-09-24 08:54:37

如何在Meteor JS中集成TinyMCE和CKEditor？

回答

相關問題