I am developing a Web-Application using ASP.NET MVC 4 and I am trying to use CKEditor for some content editing.
In debug everything works fine as long as no bundeling or minification is happening, but as soon as this does CKEditor generates wrong URLs even if I have set baseHref:

CKEDITOR.replace('ckeditor',
{
    autoUpdateElement: true,
    baseHref: '@Url.Content("~/Scripts/ckeditor/")',
    filebrowserImageUploadUrl: '/Uploads/Upload'
});

In debug the following is included:

<script src="/Scripts/ckeditor/ckeditor.js"></script>

And after bundeling/minifaction it is just:

<script src="/bundles/ckeditor?v=dLE-_JqB4vxXJ9idGep_8yUL8KfOwGhfYoEZAeIudoE1"></script>

and it trys to load the following JS files:

.js?t=D26D

Which is wrong as it should be:

.js?t=D26D

Does anyone know what I am doing wrong or how to fix this?
Alternatively I would also be fine with a possibility to disable bundeling/minification for that one bundle to avoid that problem.

I am developing a Web-Application using ASP.NET MVC 4 and I am trying to use CKEditor for some content editing.
In debug everything works fine as long as no bundeling or minification is happening, but as soon as this does CKEditor generates wrong URLs even if I have set baseHref:

CKEDITOR.replace('ckeditor',
{
    autoUpdateElement: true,
    baseHref: '@Url.Content("~/Scripts/ckeditor/")',
    filebrowserImageUploadUrl: '/Uploads/Upload'
});

In debug the following is included:

<script src="/Scripts/ckeditor/ckeditor.js"></script>

And after bundeling/minifaction it is just:

<script src="/bundles/ckeditor?v=dLE-_JqB4vxXJ9idGep_8yUL8KfOwGhfYoEZAeIudoE1"></script>

and it trys to load the following JS files:

http://DOMAIN/CONTROLLER/ACTION/config.js?t=D26D

Which is wrong as it should be:

http://DOMAIN/Scripts/ckeditor/config.js?t=D26D

Does anyone know what I am doing wrong or how to fix this?
Alternatively I would also be fine with a possibility to disable bundeling/minification for that one bundle to avoid that problem.

• javascript
• asp-mvc
• asp-mvc-4
• ckeditor

4 Answers 4

Try to add the following content before include the ckeditor's js file:

<script type="text/javascript">
    var CKEDITOR_BASEPATH = '@Url.Content("~/Scripts/ckeditor/")';
</script>

More information: http://docs.cksource./CKEditor_3.x/Developers_Guide/Specifying_the_Editor_Path

And it will also work with ckeditor 4.x.

I had similar problem but found this to work. Include it in the cshtml layout file.

<script>
  CKEDITOR.basePath = "@Url.Content("~/lib/ckeditor/")";
</script>

or with JQuery

$(document).ready(function() { 
  CKEDITOR.basePath = "@Url.Content("~/lib/ckeditor/")"; 
});

I found that a similar approach to @bluee worked for me:

I put the following in my cshtml layout file:

    <script type="text/javascript">CKEDITOR_BASEPATH = "@Url.Content("~/Scripts/ckeditor/")";</script>
    @Scripts.Render("~/Scripts/ckeditor/ckeditor.js")

The subtle difference being using CKEDITOR_BASEPATH rather than CKEDITOR.basePath. This resolves the 'CKEDITOR is not defined' issue.

I met the same problem. In fact, the bundle system trouble the ckeditor loading. So you can avoid it doing the following :

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/Script/CKEditor/ckeditor.js")
@Scripts.Render("~/Script/CKEditor/adapters/jquery.js")