정적 웹 사이트에 대한 require.js 설정 및 라이브러리 인 것처럼 사용자 정의 코드로드

Question

오버플로 스택이 새로 생겼고 실제로 require.js 설정에 대해 궁금해했습니다. 사용하는 첫 번째 시간이기 때문입니다. 그리고 여러 가지 접근법/예를 보았을 때, 지금까지 한 일이 맞는지 확실하지 않습니다. 그래서, 내 인덱스에 나는 "머리"

<script data-main="js/app" src="js/vendor/require-2.2.0-min.js"></script> 

에 내 '몸'나는 Google 웹 로그 분석 조각이의 말에 있습니다. 다른 스크립트는 색인에서 직접로드되지 않습니다. 내 $의 projectroot/JS 폴더 안에 app.js에

내가 가진 :

requirejs.config({ 
    "baseUrl": "js/vendor", 
    "paths": { 
     "app": "..", 
     "jquery" : ['//code.jquery.com/jquery-1.12.4.min','jquery-1.12.4.min'], 
     "modernizr" : 'modernizr-2.8.3-respond-1.4.2.min', 
     "bootstrap" : ['//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min','bootstrap.min'], 
     "plugins": '../plugins' 
    }, 
    "shim": { 
     "bootstrap": ["jquery"], 
     "plugins": ["bootstrap"] 
    } 
}); 

requirejs(["app/main"]); 

는 또한, app.js와 같은 폴더에 내 main.js가 포함

define([ 
    "jquery", 
    "modernizr", 
    "bootstrap", 
    "plugins" 
], function($) 
{ 
$(function() 
{ 
console.log('required plugins loaded...'); 
}); 
}); 

마지막으로, 내 plugins.js는 라이브러리가 아니지만 마지막으로로드해야하는 사용자 정의 js 코드입니다. 지금까지 괜찮은가요? 이 접근법의 단점은 무엇입니까? 유사한 방식으로 나머지 사용자 정의 js 코드를 추가해도 괜찮습니까? 답변 해 주셔서 대단히 감사합니다 !!

Answer 1

귀하의 질문에 대답하기 위해, 내가 바꿀 것 한 가지가 main.js에서 글로벌 dependecies을 넣어이다 파일 : 당신의 app.js에

define([ 
    "jquery", 
    "modernizr", 
    "bootstrap", 
    "plugins" 
] 

그렇게 같은 파일 :

requirejs(["app/main","jquery","modernizr","bootstrap","plugins"]); 

이것은 전역 종속성이 main.js 파일 대신 모든 모듈에서 공유됨을 의미합니다. 즉, 사용하려는 모든 파일에 포함시키지 않아도됩니다.

외에도 괜찮아 보입니다.