RequireJS는 프론트엔드 모듈 개발에 널리 사용되는 도구로, require.js라는 Javascript 라이브러리 파일입니다.
RequireJ의 주요 기능:
(1) 웹페이지의 응답 손실을 방지하기 위해 js 파일의 비동기 로딩을 구현합니다.
(2) 모듈 간의 종속성을 관리하여 코드 작성 및 유지 관리를 용이하게 합니다.
프론트엔드 모듈식 개발을 위한 많은 도구가 있으며 일반적으로 두 가지 범주로 나뉩니다. 하나는 dojo v1.8 이후에 내장된 모듈식 개발 구성 요소가 있는 dojo와 같은 고급 도구입니다. .js가 필요하며, sea.js는 모듈 개발에 초점을 맞춘 도구입니다.
모듈 분할 규칙에 따르면 크게 AMD와 CMD 두 가지로 구분됩니다. Dojo와 require.js는 전자를 따르고, sea.js는 CMD 사양을 따릅니다.
require는 단일 페이지 애플리케이션에서 잘 작동하지만 기존의 다중 페이지 애플리케이션에서는 require를 사용하는 것이 다소 혼란스럽고 불편할 수 있습니다.
이 글에서는 ASP.NET MVC 구조에 require를 적용하는 방법을 설명하고, 반자동 압축을 달성하기 위한 압축 스크립트를 제공합니다.
JS 코드 분리
일반적으로 ASP.NET MVC의 경로는 뷰에 해당합니다.
Views |--Shared |--_layout.cshtml |--Home |--Index.cshtml |--Blog |--Create.cshtml |--Edit.cshtml |--Detail.cshtml |--Index.cshtml
_layout.cshtml은 모든 페이지에서 공유된다고 가정합니다. 일반적인 상황에서는 _layout에서 jQuery, 부트스트랩 등과 같은 공개 js 라이브러리를 참조하므로 다른 페이지에서 이러한 라이브러리를 다시 참조할 필요가 없으므로 코딩 효율성이 향상됩니다. 그러나 서로 다른 페이지는 결국 서로 다른 js, 특히 페이지 자체의 기능을 구현하는 사용자 정의 js에 의존하게 됩니다. 이러한 방식으로 우리는 다른 페이지에서 특수 js를 참조하거나 다음과 같이 페이지에 직접 js를 작성해야 합니다. 코드는 보기에 자주 나타납니다:
<script type="text/javascript"> $(function(){...}); </script>
이로 인해 페이지가 혼란스러워지고 페이지의