ASP.NET Core如何在发行版中删除特定的CSS和JavaScript文件

时间:2018-10-01 13:16:28

标签: javascript html css asp.net-core-2.1

我的问题是,当我使网站正常运行时,但当我将其放到服务器上时,会显示以下CSS和JS块:

<link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css" />
<meta name="x-stylesheet-fallback-test" content="" class="sr-only" /><script>!function(a,b,c,d){var e,f=document,g=f.getElementsByTagName("SCRIPT"),h=g[g.length-1].previousElementSibling,i=f.defaultView&&f.defaultView.getComputedStyle?f.defaultView.getComputedStyle(h):h.currentStyle;if(i&&i[a]!==b)for(e=0;e<c.length;e++)f.write('<link href="'+c[e]+'" '+d+"/>")}("position","absolute",["\/lib\/bootstrap\/dist\/css\/bootstrap.min.css"], "rel=\u0022stylesheet\u0022 ");</script>
        <link rel="stylesheet" href="/css/site.min.css?v=kHvJwvVAK1eJLN4w8xygUR3nbvlLmRwi5yr-OuAO90E" />

        <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.2.621/styles/kendo.common-nova.min.css" />
<meta name="x-stylesheet-fallback-test" content="" class="k-common-test-class" /><script>!function(a,b,c,d){var e,f=document,g=f.getElementsByTagName("SCRIPT"),h=g[g.length-1].previousElementSibling,i=f.defaultView&&f.defaultView.getComputedStyle?f.defaultView.getComputedStyle(h):h.currentStyle;if(i&&i[a]!==b)for(e=0;e<c.length;e++)f.write('<link href="'+c[e]+'" '+d+"/>")}("opacity","0",["\/lib\/kendo-ui\/styles\/kendo.common-nova.min.css"], "rel=\u0022stylesheet\u0022 ");</script>

        <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.2.621/styles/kendo.nova.min.css" />
<meta name="x-stylesheet-fallback-test" content="" class="k-theme-test-class" /><script>!function(a,b,c,d){var e,f=document,g=f.getElementsByTagName("SCRIPT"),h=g[g.length-1].previousElementSibling,i=f.defaultView&&f.defaultView.getComputedStyle?f.defaultView.getComputedStyle(h):h.currentStyle;if(i&&i[a]!==b)for(e=0;e<c.length;e++)f.write('<link href="'+c[e]+'" '+d+"/>")}("opacity","0",["\/lib\/kendo-ui\/styles\/kendo.nova.min.css"], "rel=\u0022stylesheet\u0022 ");</script>
    
    

    
    
        <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js" crossorigin="anonymous" integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT">
        </script>
<script>(window.jQuery||document.write("\u003Cscript src=\u0022\/lib\/jquery\/dist\/jquery.min.js\u0022 crossorigin=\u0022anonymous\u0022 integrity=\u0022sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV\u002BrXbYlF2cqB8txI\/8aZajjp4Bqd\u002BV6D5IgvKT\u0022\u003E\u003C\/script\u003E"));</script>
        <script src="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/bootstrap.min.js" crossorigin="anonymous" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa">
        </script>
<script>(window.jQuery && window.jQuery.fn && window.jQuery.fn.modal||document.write("\u003Cscript src=\u0022\/lib\/bootstrap\/dist\/js\/bootstrap.min.js\u0022 crossorigin=\u0022anonymous\u0022 integrity=\u0022sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa\u0022\u003E\u003C\/script\u003E"));</script>
        <script src="/js/site.min.js?v=47DEQpj8HBSa-_TImW-5JCeuQeRkm5NMpJWZG3hSuFU"></script>

        <script src="https://kendo.cdn.telerik.com/2017.2.621/js/kendo.all.min.js">
        </script>
<script>(window.kendo||document.write("\u003Cscript src=\u0022\/lib\/kendo-ui\/js\/kendo.all.min.js\u0022\u003E\u003C\/script\u003E"));</script>
        <script src="https://kendo.cdn.telerik.com/2017.2.621/js/kendo.aspnetmvc.min.js">
        </script>
<script>(kendo.data.transports['aspnetmvc-ajax']||document.write("\u003Cscript src=\u0022\/lib\/kendo-ui\/js\/kendo.aspnetmvc.min.js\u0022\u003E\u003C\/script\u003E"));</script>

我确实检查了布局文件,并且它分别具有css和js的Develepment,Staging和Production的环境exclude标签。

<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" />

        <link rel="stylesheet"
              href="https://kendo.cdn.telerik.com/2017.2.621/styles/kendo.common-nova.min.css"
              asp-fallback-href="~/lib/kendo-ui/styles/kendo.common-nova.min.css"
              asp-fallback-test-class="k-common-test-class"
              asp-fallback-test-property="opacity" asp-fallback-test-value="0" />

        <link rel="stylesheet"
              href="https://kendo.cdn.telerik.com/2017.2.621/styles/kendo.nova.min.css"
              asp-fallback-href="~/lib/kendo-ui/styles/kendo.nova.min.css"
              asp-fallback-test-class="k-theme-test-class"
              asp-fallback-test-property="opacity" asp-fallback-test-value="0" />
    </environment>
    <environment exclude="Staging,Production">
    <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" />

    <link rel="stylesheet"
            href="https://kendo.cdn.telerik.com/2017.2.621/styles/kendo.common-nova.min.css"
            asp-fallback-href="~/lib/kendo-ui/styles/kendo.common-nova.min.css"
            asp-fallback-test-class="k-common-test-class"
            asp-fallback-test-property="opacity" asp-fallback-test-value="0" />

    <link rel="stylesheet"
            href="https://kendo.cdn.telerik.com/2017.2.621/styles/kendo.nova.min.css"
            asp-fallback-href="~/lib/kendo-ui/styles/kendo.nova.min.css"
            asp-fallback-test-class="k-theme-test-class"
            asp-fallback-test-property="opacity" asp-fallback-test-value="0" />
    </environment>

<environment exclude="Development">
        <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"
                asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
                asp-fallback-test="window.jQuery"
                crossorigin="anonymous"
                integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT">
        </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="~/js/site.min.js" asp-append-version="true"></script>

        @*  Place Kendo UI scripts after jQuery *@
        <script src="https://kendo.cdn.telerik.com/2017.2.621/js/kendo.all.min.js"
                asp-fallback-src="~/lib/kendo-ui/js/kendo.all.min.js"
                asp-fallback-test="window.kendo">
        </script>
        <script src="https://kendo.cdn.telerik.com/2017.2.621/js/kendo.aspnetmvc.min.js"
                asp-fallback-src="~/lib/kendo-ui/js/kendo.aspnetmvc.min.js"
                asp-fallback-test="kendo.data.transports['aspnetmvc-ajax']">
        </script>
    </environment>
    <environment exclude="Staging,Production">
        <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"
                asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
                asp-fallback-test="window.jQuery"
                crossorigin="anonymous"
                integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT">
        </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="~/js/site.min.js" asp-append-version="true"></script>

        @*  Place Kendo UI scripts after jQuery *@
        <script src="https://kendo.cdn.telerik.com/2017.2.621/js/kendo.all.min.js"
                asp-fallback-src="~/lib/kendo-ui/js/kendo.all.min.js"
                asp-fallback-test="window.kendo">
        </script>
        <script src="https://kendo.cdn.telerik.com/2017.2.621/js/kendo.aspnetmvc.min.js"
                asp-fallback-src="~/lib/kendo-ui/js/kendo.aspnetmvc.min.js"
                asp-fallback-test="kendo.data.transports['aspnetmvc-ajax']">
        </script>
    </environment>

那么为什么发布网站时会显示排除的代码?

任何帮助将不胜感激

1 个答案:

答案 0 :(得分:0)

您的最终标记似乎工作正常,因此对于您的确切问题我有些困惑。您已经定义了两个环境条件,但是它们看起来都具有完全相同的标记,因此将在开发和生产/阶段上呈现相同的标记,这没有任何意义。

首先,您要定义将在开发中显示的内容,这应该是没有降级或版本控制的本地未缩小版本:

<environment include="Development">
    <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
    <link rel="stylesheet" href="~/css/site.css" />
    <link rel="stylesheet" href="~/lib/kendo-ui/styles/kendo.common-nova.css" />
    <link rel="stylesheet" href="~/lib/kendo-ui/styles/kendo.nova.css" />
</environment>

然后,您定义可以使用CDN,回退,缩小和版本控制的生产标记。

<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" />
    <link rel="stylesheet"
          href="https://kendo.cdn.telerik.com/2017.2.621/styles/kendo.common-nova.min.css"
          asp-fallback-href="~/lib/kendo-ui/styles/kendo.common-nova.min.css"
          asp-fallback-test-class="k-common-test-class"
          asp-fallback-test-property="opacity" asp-fallback-test-value="0" />
    <link rel="stylesheet"
          href="https://kendo.cdn.telerik.com/2017.2.621/styles/kendo.nova.min.css"
          asp-fallback-href="~/lib/kendo-ui/styles/kendo.nova.min.css"
          asp-fallback-test-class="k-theme-test-class"
          asp-fallback-test-property="opacity" asp-fallback-test-value="0" />
</environment>

鉴于已在目标系统上正确设置了环境变量,第一个块将在开发中可用,第二个块将在登台/生产中可用。