2014-06-08 3 views
0

저는 ASP.NET MVC 4를 처음 접했고 css 및 js 파일을 포함하는 ASP.NET 방법이 무엇인지 궁금합니다.ASP.NET MVC에서 js 및 css 파일 관리

내 PHP 프로젝트에서

배경, 나는 보통 컨트롤러에 살고 CSS와 JS 파일 이름에 대한 배열을 가지고있다. 이 배열은 함수가 반복되고 각 항목에 대한 html 태그를 생성하고이 시점에서 자동 버전을 생성하는 마스터 템플릿에 전달됩니다. CSS는 <head>에 있으며 JS는 </body> 태그 바로 앞에 있습니다. 내가

  1. BundleConfig 알고있다

    사항 전달되는 클래스에 약간의 정적 기능을 만들기

  2. (그러나, 나는 페이지 별 CSS/JS하지 글로벌 사람과 엄격하게 걱정) 파일 목록에서 질문 따라 스크립트와 링크 태그

생성

BundleConfig와 같이 자동 버전을 포함하고 축소 할 수있는 페이지 (또는 컨트롤러)의 특정 js 및 css 파일은 어떻게 관리해야합니까?

답변

1

하나의 옵션은 레이아웃 페이지 내에서 @RenderSection을 사용하는 것입니다. 레이아웃 페이지에서 레이아웃을 사용하는 모든 페이지에 공통된 파일 및/또는 번들을 포함하고 페이지 특정 파일이 포함될 자리 표시자를 지정하려면 @RenderSection을 사용하십시오 (두 번째 매개 변수 = false은 선택 사항임을 유의하십시오)

레이아웃

<!DOCTYPE html> 
<html> 
    <head> 
    <title>@ViewBag.Title</title> 
    <link href="~/Content/Common.css" rel="stylesheet" /> // Common .css files here 
    @RenderSection("styles", false) // Place holder for optional page specific .css files 
    @Scripts.Render("~/bundles/modernizr") 
    </head> 
    <body> 
    <div id="content"> 
     @RenderBody() 
    </div> 
    @Scripts.Render("~/bundles/jquery") // Common .js files or bundles 
    @RenderSection("scripts", required: false) // Place holder for optional page specific .js files or bundles 
    </body> 
</html> 

페이지

은 다음 페이지에서, 페이지의 특정 번들 및/또는 파일

@model .... 
// Page specific html 
@section styles { 
    <link href="~/Content/page-specific-stylesheet.css" rel="stylesheet" /> 
} 
@section Scripts { 
    @Scripts.Render("~/bundles/page-specific-bundle") 
    <script src="~/Scripts/page-specific-file.js"></script> 
    <script type="text/javascript"> 
    // page specific script 
    </script> 

}

의 섹션을 정의

하나의 파일이 있어도 페이지 별 파일에 대한 번들을 만들 수있는 이유가 없습니다. 장점은 프로덕션 환경에서 파일이 자동으로 축소된다는 것입니다 (이미 동일한 폴더에 .min.js가 추가 된 파일이없는 경우 제외). 기본적으로 번들은 브라우저에 캐시됩니다 (12 개월 전부터 생각합니다). 파일을 편집하면 새롭게 축소 된 버전이 만들어지고 이전 버전이 브라우저 캐시에서 제거됩니다.

관련 문제