-2

Publiquei uma aplicação Asp.Net Core 2.1 no Azure, mas o CSS não funciona, logo a aplicação, fica toda desconfigurada. Em ambiente de desenvolvimento, minha aplicação funciona normalmente.

Observei no devtools que não carrega nenhum CSS ou JS. Mas como falei, em ambiente de desenvolvimento tudo funciona normal.

Como posso resolver esse problema? Abaixo segue arquivos.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewData["Title"]</title>
    
    <environment include="Development">
        <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
        <link rel="stylesheet" href="~/vendor/fontawesome/css/font-awesome.css" />
        <link rel="stylesheet" href="~/vendor/animate.css/animate.css" />
        <link rel="stylesheet" href="~/vendor/iCheck/skins/all.css" />
        <link rel="stylesheet" href="~/icons/pe-icon-7-stroke/css/pe-icon-7-stroke.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>

    <!-- Google Fonts -->
    <link href='https://fonts.googleapis.com/css?family=Quicksand:300,400,700' rel='stylesheet' type='text/css'>
</head>
<body class="fixed-navbar sidebar-scroll">

    <div id="header">
        @await Html.PartialAsync("_Header")
    </div>


    <aside id="menu">
        @await Html.PartialAsync("_Navigation")
    </aside>

    <div id="wrapper">
        @RenderBody()

        @await Html.PartialAsync("_Footer")
    </div>

    <environment include="Development">
        <script src="~/lib/jquery/dist/jquery.js"></script>
        <script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>
        <script src="~/vendor/slimScroll/jquery.slimscroll.js"></script>
        <script src="~/vendor/metisMenu/dist/metisMenu.js"></script>
        <script src="~/vendor/iCheck/icheck.js"></script>
        <script src="~/vendor/sparkline/index.js"></script>
        <script src="~/vendor/chartjs/Chart.min.js"></script>
        <script src="~/lib/jsMask/jquery.mask.min.js"></script>
        <script src="~/js/grifo.js"></script>
        <script src="~/js/site.js" asp-append-version="true"></script>
    </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="~/vendor/jquery-ui/jquery-ui.min.js" asp-append-version="true"></script>
        <script src="~/js/jquery-1.8.3.min.js" asp-append-version="true"></script>
    </environment>

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

3
  • Coloca o endereço que leva ao css, por exemplo, seu_dominio.com/pasta_em_se_encontra_o_CSS/arquivo.css Commented 24/10/2018 às 11:04
  • 1
    Porque o uso do "~" nas directorias? E metes-te as pastas que contem os css e js no Azur também?
    – Pbras
    Commented 24/10/2018 às 11:16
  • O uso do "~" nos diretórios é uma convenção do próprio Asp.Net. Ele já vem configurado assim. Se eu mudar não funciona nem em ambiente de desenvolvimento @Pbras Commented 24/10/2018 às 13:55

1 Resposta 1

1

Resolvido. As View de Layouts geralmente tem a formatação com tags <enviroment include> e <enviroment exclude> conforme postei na pergunta. Eu apenas excluir essa tags deixando as chamadas com tags html padrão assim:

<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="~/vendor/fontawesome/css/font-awesome.css" />
<link rel="stylesheet" href="~/vendor/animate.css/animate.css" />
<link rel="stylesheet" href="~/vendor/iCheck/skins/all.css" />
<link rel="stylesheet" href="~/icons/pe-icon-7-stroke/css/pe-icon-7-stroke.css" />
<link rel="stylesheet" href="~/css/site.css" />

Obrigado a todos pela atenção.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .