MVC4 与 TinyMCE 捆绑

Question

我在使用 MVC4 捆绑和 TinyMCE 时遇到问题。我收到此错误：

    GET http://localhost:54717/Admin/EditText//langs/da.js 404 (Not Found) Site:1
    GET http://localhost:54717/Admin/EditText//plugins/lists/editor_plugin.js 404 (Not Found) Site:1
    GET http://localhost:54717/Admin/EditText//plugins/autolink/editor_plugin.js 404 (Not Found) Site:1
    GET http://localhost:54717/Admin/EditText//themes/advanced/editor_template.js 404 (Not Found) Site:1
    GET http://localhost:54717/Admin/EditText//plugins/spellchecker/editor_plugin.js 404 (Not Found) Site:1
    GET http://localhost:54717/Admin/EditText//plugins/pagebreak/editor_plugin.js 404 (Not Found) Site:1
    GET http://localhost:54717/Admin/EditText//plugins/style/editor_plugin.js 404 (Not Found) Site:1
    GET http://localhost:54717/Admin/EditText//plugins/table/editor_plugin.js 404 (Not Found) Site:1
    GET http://localhost:54717/Admin/EditText//plugins/layer/editor_plugin.js 404 (Not Found) Site:1
    GET http://localhost:54717/Admin/EditText//plugins/save/editor_plugin.js 404 (Not Found)
Failed to load: http://localhost:54717/Admin/EditText//langs/da.js 

代码如下（在BundleConfig.cs中）

bundles.Add(
      new ScriptBundle("~/Scripts/Site").Include(
        "~/Scripts/jquery-1.9.1.js",
        "~/Scripts/tinymce/tiny_mce.js",
         "~/Scripts/jquery-ui-1.10.1.js",
        "~/Scripts/jquery.ui.slider.js",
        "~/Scripts/oline.Base.js",
        "~/Scripts/Validate/Language/jquery.validationEngine-da.js",
        "~/Scripts/Validate/jquery.validationEngine.js",
        "~/Scripts/jquery.ui.effect-blind.js",
        "~/Scripts/jquery.placeholder.min.js"));

      BundleTable.EnableOptimizations = true; 

在布局中：

@Scripts.Render("~/Scripts/Site")

但是，如果我从捆绑中删除 tiny_mce.js 并像这样放置它 script src="~/Scripts/tinymce/tiny_mce.js"></script> 它工作得很好。是不是因为我需要覆盖tinymce的自动加载并手动放置？

Answer 1

我知道这是一个长期死的帖子，但是，因为我今天自己偶然发现了这个问题，所以我想减少我的 2 美分。

以上接受和/或批准的答案都很好，但它们并没有关闭我的渴望，因为没有多个连接到服务器的开销，以便下载 tinyMCE 工作所需的所有 js，而tinymce(.min).js 正在请求他们。

由于我看到主 js 文件中实际上有一个 javascript 加载器，它仅在尚未定义变量（在其中声明的变量）时才下载所需的脚本，所以我想将整个 .js 集包含在一个中捆绑，这样当您调用 .init 函数脚本时就不需要下载。 比如：

bundles.Add(new ScriptBundle("~/Scripts/tinymce/bundledTinyMCE").IncludeDirectory("~/Scripts/tinymce", "*.js", true));

假设您的 tinyMCE 位于文件夹 ~/Scripts/tinymce。

不会触发进一步的后期脚本下载，并且您的 tinyMCE js 将被缩小和捆绑（在发布配置中）

Answer 2

在我的情况下，我执行以下操作来解决： 忽略捆绑，直接引用插件的缩小版。

@section scripts
{
    @Scripts.Render("~/bundles/ajax")
    @Scripts.Render("~/bundles/jqueryval")
    <script src="~/Scripts/tinymce/tinymce.min.js"></script>
}

Answer 3

@Codeacula 有一个很好的解决方案，但另一种方法是将捆绑路径相对于 TinyMCE 文件夹。

请注意，您必须将其从主脚本包中拉出才能使其正常工作，但由于我没有在每个页面上都使用 TinyMCE，因此将其添加到主包中没有任何意义。另外，我使用 .min.js 作为扩展名，因为它加载基于主文件扩展名的插件，而我除了 .min.js 文件之外什么都没有我的插件文件夹。

var tinymce = new ScriptBundle("~/Scripts/tinymce/tinymce-bundle.min.js")
    .Include("~/Scripts/tinymce/tinymce.min.js");
bundles.Add(tinymce);

在需要 TinyMCE 的页面上：

@Scripts.Render("~/Scripts/tinymce/tinymce-bundle.min.js");

Answer 4

在调用 tinymce.init 之前，请执行以下操作：

tinymce.baseURL = "@Url.Content("~/Scripts/tinymce")";

或者你的脚本保存在哪里。

我也有同样的问题。这是我的最终成品

    <script>
    tinymce.baseURL = "@Url.Content("~/Scripts/tinymce")";

    // tinyMCE setup
    tinymce.init({
        selector: "textarea.rt-edit",
        browser_spellcheck: true,
        menubar: false,
        plugins: "paste,preview,code,textcolor,link",
        invalid_elements: "script",

        // Theme options - button# indicated the row# only
        toolbar1: "bold italic underline strikethrough subscript superscript link | fontselect fontsizeselect forecolor backcolor | justifyleft justifycenter justifyright cut copy paste pastetext pasteword| outdent indent | undo redo | code preview ",

    });
</script>

Answer 5

今天也遇到了。似乎在捆绑tinymce时，它无法找到其他依赖脚本（插件、编辑器模板等）。

由于 TinyMCE 已经缩小，我只是通过从捆绑包中排除它并单独加载它来解决这个问题。像这样的：

@* include tinymce unbundled so it can find its plugins and other scripts internally when bundles are optimized *@
@if (BundleTable.EnableOptimizations)
{
    <script type="text/javascript" src="~/scripts/tinymce/tiny_mce.js"></script>
}
else
{
    <script type="text/javascript" src="~/scripts/tinymce/tiny_mce_src.js"></script>
}

@Scripts.Render("~/Scripts/Site")

这样，您在启用优化时仍然使用预先缩小的版本，而在调试时仍然使用原始源代码。但最终浏览器会发送多个请求。