Asp.Net MVC 中的 Summernote

Question

我尝试按照教程 here.

在我的 Asp.Net MVC 项目中实现 summernote 所见即所得编辑器

我以为我遇到了与 this guy 相同的问题并实施了建议，但仍然无济于事。

我还根据修改了我的 web.config 文件以尝试解决字形问题，但无济于事。

如果有人能告诉我我做错了什么，将不胜感激。

看到文本区域中的文本区域和未呈现的按钮图标

根据 Chrome 调试器

呈现 HTML

.cshtml

<div class="form-group">
            @Html.LabelFor(model => model.Recipe.Instructions, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.TextAreaFor(model => model.Recipe.Instructions, htmlAttributes: new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.Recipe.Instructions, "", new { @class = "text-danger" })
            </div>
        </div>

捆绑包

 public class BundleConfig
    {
        // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
        public static void RegisterBundles(BundleCollection bundles) {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.validate*"));

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

            bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                      "~/Scripts/bootstrap.js",
                      "~/Scripts/respond.js"));

            bundles.Add(new StyleBundle("~/Content/css").Include(
                      "~/Content/bootstrap.css",
                      "~/Content/font-awesome.css",
                      "~/Content/site.css",
                      "~/Content/globalStyles.css"));

            bundles.Add(new StyleBundle("~/Content/summernote").Include(
                "~/Content/summernote/summernote.css"
                ));

            bundles.Add(new ScriptBundle("~/bundles/summernote").Include(
               "~/Content/summernote/summernote.js"
               ));
        }
    }

文件结构

chrome 错误

Answer 1

我修改了我的 cshtml 文件中的脚本部分以包含 css 包，就像这样

@section Scripts {
    @Scripts.Render(
        "~/bundles/jqueryval",
        "~/bundles/summernote",
        "~/Scripts/recipeCreate.js",
        "~/Scripts/wysiwyg.js");
    @Styles.Render(
        "~/Content/summernote"
    );
}

Answer 2

我改了bundle.config

bundles.Add(new StyleBundle("~/Content/summernote/summernote.css").Include( "~/Content/summernote/summernote.css" ));

并在 _Layout.cshtml

中使用此捆绑包进行了更改

`@Styles.Render("~/Content/summernote/summernote.css")`

Asp.Net MVC 中的 Summernote

Summernote in Asp.Net MVC

asp.net-mvc

font-awesome

summernote