Question

我在 Visual Studio 2015 下开发了 Asp.net Core MVC WebApplication。我在我的网络应用程序中使用 Sass文件。为了让我的FrontEnd开发人员的生活更轻松，我想在我的浏览器（Chrome）中将.css文件映射到.scss文件。

我在 wwwroot 下添加了 .css 文件和 .css.map 文件以及 .scss 来源文件夹。（可以肯定的是，它是公共文件夹）。

所以我的结构是

ProjectName
  wwwroot
    css
    sass

但是当我在浏览器中打开文件时，它总是空的。

我已在我的Startup.cs文件中添加app.UseDirectoryBrowser();和app.UseStaticFiles();，以确保它有效。

我可以看到我的文件，但是当我点击它时，......没有任何事情发生（白页）。

我缺少什么？

Answer 1

我找到了解决方案。我需要在Startup.cs文件中为.scss文件添加正确的MIME类型。

public void Configure(IApplicationBuilder app, IHostingEnvironment env,
    ILoggerFactory loggerFactory)
{
    if (env.IsDevelopment())
    {
        app.UseDirectoryBrowser();

        var provider = new FileExtensionContentTypeProvider();
        // Add .scss mapping
        provider.Mappings[".scss"] = "text/css";
        app.UseStaticFiles(new StaticFileOptions()
        {
            ContentTypeProvider = provider
        });
    }
    else
    {
        app.UseStaticFiles();
    }
}

Answer 2

rdhainaut的答案对我有用，但是如果将sass文件存储在webroot以外的文件夹中，则必须添加一个文件提供程序，该文件提供程序可以在startup.cs文件的应用程序目录中找到它。我不确定这是否是最佳做法，但这是一个选择。

public void Configure(IApplicationBuilder app, IHostingEnvironment env,
    ILoggerFactory loggerFactory)
{
     //do something

     app.UseStaticFiles(new StaticFileOptions()
            {
                FileProvider = new PhysicalFileProvider(
              Path.Combine(Directory.GetCurrentDirectory(), @"SassyStyles")),
                RequestPath = new PathString("/SassyStyles"),
                ContentTypeProvider = provider
            });

     //do more stuff

}

Asp.net核心浏览器中的空.scss文件

2 个答案: