將ASPNETCORE_ENVIRONMENT設置為Production時，內聯頁面JQuery函數不起作用

Question

我在ASP.NET CORE 1.0中遇到了最奇怪的問題。 將ASPNETCORE_ENVIRONMENT設置為Production時，我的JQuery不起作用。 ITS僅頁面的內聯jquery。 所有其他jquery函數都可以正常工作。

下面是我的代碼。

 $(function () {

    if ($("#LeadId").val() == '') {
        $("#nextButton").addClass("disabledbutton");
        $("#divTerms").removeClass("ControlIsVisible");
    } else {
        $("#nextButton").removeClass("disabledbutton");
        $("#divTerms").addClass("ControlIsVisible");
    }

    $('#lblCheckBox').click(function () {
        var isChecked = $("#chkTerms").is(":checked");
        if (isChecked === true) {
            $('#lblCheckBox').removeClass("active");
            $("#nextButton").addClass("disabledbutton");
        }
        else {
            $('#lblCheckBox').addClass("active");
            $("#nextButton").removeClass("disabledbutton");
        }
    });

    $.get("http://ipinfo.io", function (response) {
        $("#PersonalDetail_ActualCountry").val(response.country);
    }, "jsonp");
});

_Layout.cshtml

  <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>@ViewBag.Title</title>
    <environment names ="Development">
     <link href="~/css/min/site.min.css" rel="stylesheet" />
    </environment>
    <environment names="Staging, Production">
        <link href="~/css/min/site.min.css" rel="stylesheet" />
    </environment>
</head>
<body>
    <div>
        <environment names="Development">
             <script src="~/js/min/site.min.js"></script>
        </environment>
        <environment name="Staging, Production">
            <script src="~/js/min/site.min.js"></script>
        </environment>
        @RenderBody()
    </div>
</body>
</html>

Answer 1

您需要在生產中添加CSS和腳本文件的鏈接。

可以通過直接在_layout.cshtml添加來完成

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>@ViewBag.Title</title>
    <environment names ="Development">
        <link asp-href-include="~/css/*.css" rel="stylesheet" />
        <link asp-href-include="~/css/CustomCss.css" rel="stylesheet" />
    </environment>
    <environment names="Staging, Production">
        <link href="~/css/min/site.min.css" rel="stylesheet" />
        <!-- Add this line -->
        <link asp-href-include="~/css/CustomCss.css" rel="stylesheet" />
    </environment>
</head>
<body>
    <div>
        <environment names="Development">
            <script asp-src-include="~/js/jquery.js"></script>
            <script asp-src-include="~/js/jquery.validate.js"></script>
            <script asp-src-include="~/js/jquery.validate.unobtrusive.js"></script>
            <script asp-src-include="~/js/bootstrap.js"></script>
            <script asp-src-include="~/js/CustomScript.js"></script>
        </environment>
        <environment name="Staging, Production">
            <script src="~/js/min/site.min.js"></script>
        </environment>
        @RenderBody()
    </div>
</body>
</html>

或者在bundlesconfig.json更好

// Configure bundling and minification for the project.
// More info at https://go.microsoft.com/fwlink/?LinkId=808241
[
  {
    "outputFileName": "wwwroot/css/site.min.css",
    // An array of relative input file paths. Globbing patterns supported
    "inputFiles": [
      "wwwroot/css/site.css"
      // Add custom css to bundle.
      "wwwroot/css/CustomCss.css"
    ]
  },
  {
    "outputFileName": "wwwroot/js/site.min.js",
    "inputFiles": [
      "wwwroot/js/site.js"
      // Add custom script to bundle.
      "wwwroot/js/CustomScript.js"
    ],
    // Optionally specify minification options
    "minify": {
      "enabled": true,
      "renameLocals": true
    },
    // Optinally generate .map file
    "sourceMap": false
  }
]

Answer 2

檢查您發布的版本是否在wwwroot文件夾中包含site.min.js。 這可以使用project.json中的“ publishOptions”配置來完成：

"publishOptions": {
   "include": [
     "wwwroot",
     "Views",
     "appsettings.json",
     "web.config"
   ]
}

如果您發布的文件夾包含您的site.min.js。 檢查您的自定義代碼是否在Jquery框架的下面。

gulp.task("min:corejs", function () {
return gulp.src([
        paths.component + 'jquery/dist/jquery.js', 
        'js/customjs.js'
])
    .pipe(concat(paths.corejs))
    .pipe(uglify())
    .pipe(gulp.dest("."));

}）;

將ASPNETCORE_ENVIRONMENT設置為Production時，內聯頁面JQuery函數不起作用

問題描述

2 個解決方案

解決方案1
0 2016-09-01 08:04:55

解決方案2
0 2016-09-01 09:02:39

將ASPNETCORE_ENVIRONMENT設置為Production時，內聯頁面JQuery函數不起作用

問題描述

2 個解決方案

解決方案1 0 2016-09-01 08:04:55

解決方案2 0 2016-09-01 09:02:39

解決方案1
0 2016-09-01 08:04:55

解決方案2
0 2016-09-01 09:02:39