ASP.NET Core 2.0：未找到静态文件（site.min.js）

时间：2018-01-04 14:23:17

标签： c# asp.net-core-mvc asp.net-core-2.0

我想通过在Visual Studio 2017中发布配置文件来部署ASP.NET Core Web应用程序。一切都被复制到目标文件夹并且工作正常，但“site.js”文件除外。在目标文件夹中，我在wwwroot / js文件夹中看到site.js和site.min.js，但后者为空。我在浏览器中也出现了控制台错误：

Failed to load resource: the server responded with a status of 404 (Not Found) site.min.js

在页面源代码中，我看到文件已正确加载：

<script src="/wwwroot/js/site.min.js"></script>

Program.cs文件：

public class Program
{
    public static void Main(string[] args)
    {
        var host = new WebHostBuilder()
             .UseKestrel()
             .UseContentRoot(Directory.GetCurrentDirectory())
             .UseIISIntegration()
             .UseStartup<Startup>()
             .Build();

        host.Run();
    }
}

Startup.cs中的服务配置：

public void ConfigureServices(IServiceCollection services)
{
    services.AddMvc();
}
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    app.UseStaticFiles();

    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
        app.UseBrowserLink();
    }
    else
    {
        app.UseExceptionHandler("/Home/Error");
    }

    app.UseMvc(routes =>
    {
        routes.MapRoute(
            name: "default",
            template: "{controller=Home}/{action=Index}/{id?}");
    });    
}

_Layout.cshtml：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Dashboard</title>

    <environment include="Development">
        <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
        <link rel="stylesheet" href="~/css/site.css" />
    </environment>
    <environment exclude="Development">
        <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css"
              asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
              asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" />
        <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />
    </environment>
</head>
<body>
    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a asp-area="" asp-controller="Home" asp-action="Index" class="navbar-brand">Home</a>
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li><a asp-area="" asp-controller="Home" asp-action="Create">View orders</a></li>
                </ul>
            </div>
        </div>
    </nav>
    <div class="container body-content">
        @RenderBody()
        <hr />
        <footer>
            <p>&copy; 2018 - test app</p>
        </footer>
    </div>

    <environment include="Development">
        <script src="~/lib/jquery/dist/jquery.js"></script>
        @*<script src="~/lib/jquery/jquery-validation/dist/jquery.validate.js"></script>*@
        <script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>
        <script src="~/js/site.js"></script>
    </environment>
    <environment exclude="Development">
        <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.2.0.min.js"
                asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
                asp-fallback-test="window.jQuery"
                crossorigin="anonymous"
                integrity="sha384-K+ctZQ+LL8q6tP7I94W+qzQsfRV2a+AfHIi9k8z8l9ggpc8X+Ytst4yBo/hH+8Fk">
        </script>
        <script src="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/bootstrap.min.js"
                asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.min.js"
                asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal"
                crossorigin="anonymous"
                integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa">
        </script>
        <script src="~/wwwroot/js/site.min.js" asp-append-version="false"></script>
    </environment>

    @RenderSection("Scripts", required: false)
</body>
</html>

site.js位于wwwroot / js文件夹中（我没有移动它或重新创建它）。 我也没有改变bundleconfig.json。其内容如下：

[
  {
    "outputFileName": "wwwroot/css/site.min.css",
    // An array of relative input file paths. Globbing patterns supported
    "inputFiles": [
      "wwwroot/css/site.css"
    ]
  },
  {
    "outputFileName": "wwwroot/js/site.min.js",
    "inputFiles": [
      "wwwroot/js/site.js"
    ],
    // Optionally specify minification options
    "minify": {
      "enabled": true,
      "renameLocals": true
    },
    // Optionally generate .map file
    "sourceMap": false
  }
]

这是我错过的东西吗？ 提前谢谢。

更新：

我更改了site.min.js脚本标记：

<script src="~/js/site.min.js" asp-append-version="true"></script>

我不再收到404错误，但是site.min.js仍然是空的，因此是一个缩小问题。

更新2：

site.js内容：

$('#chkMinId').change(function () {
    var checked = $(this).is(':checked');
    var target = $('#txtMinId');
    console.log(checked ? 'yes' : 'no');

    if (!checked) {
        target.prop('disabled', true);
    } else {
        target.removeAttr('disabled');
    }
});

$('#chkMaxId').change(function () {
    var checked = $(this).is(':checked');
    var target = $('#txtMaxId');
    console.log(checked ? 'yes' : 'no');

    if (!checked) {
        target.prop('disabled', true);
    } else {
        target.removeAttr('disabled');
    }
});

3 个答案:

答案 0 :(得分：9)

解决site.min.js 404错误：

将您的site.min.js脚本标记更改为

<script src="~/js/site.min.js" asp-append-version="true"></script>

wwwroot表示＆＃39; root＆＃39;是在Web服务器而不是文件系统。

解决site.min.js中没有内容的问题：

您必须安装名为BuildBundlerMinifier的nuget包。安装此软件包后，我看到我的site.min.js文件填充了site.js中的代码。

我在阅读此helpdoc时发现了这一点：Build-time execution of bundling and minification

答案 1 :(得分：4)

参考：https://docs.microsoft.com/en-us/aspnet/core/fundamentals/static-files?view=aspnetcore-2.1&tabs=aspnetcore2x

将以下内容添加到Startup.cs中的Configure方法：

app.UseStaticFiles(new StaticFileOptions
    {
        FileProvider = new PhysicalFileProvider(
        Path.Combine(Directory.GetCurrentDirectory(), "js")),
        RequestPath = "/js"
    }
);

答案 2 :(得分：1)

将site.min.js脚本标记更改为

<script src="js/site.min.js" asp-append-version="true"></script>

什么是wwwroot ？

  

wwwroot文件夹是ASP.NET Core中的新增功能。中的所有静态文件   你的项目进入这个文件夹。这些是应用程序的资产   直接服务于客户，包括HTML文件，CSS文件，图像   文件和JavaScript文件。 wwwroot文件夹是你的根目录   网站。也就是说，http://some.hostname/指向wwwroot，所有网址   静态内容相对于wwwroot文件夹。

     

代码文件应放在wwwroot之外。这包括所有   你的C＃文件和Razor文件。 ＆GT;有一个wwwroot文件夹保持干净   代码文件和静态文件之间的分离。

相关问题
最新问题