비공식 문서, 빠른 검색을 위해 자신의 공식 문서의 텍스트와 예를 구성하십시오.
왜 sea.js를 사용합니까?
SEA.JS는 다음과 같은 핵심 기능을 갖춘 간단하고 자연스러운 코드 쓰기 및 조직 방법을 추구합니다.
간단하고 친근한 모듈 정의 사양 : Sea.js는 CMD 사양을 따르고 node.js와 같은 모듈 코드를 쓸 수 있습니다.
자연스럽고 직관적 인 코드 구성 : 종속성의 자동로드 및 간결하고 명확한 구성을 통해 더 많은 코딩을 즐길 수 있습니다.
SEA.JS는 또한 개발 디버깅 및 성능 최적화에 매우 유용한 공통 플러그인을 제공하며 풍부한 확장 가능한 인터페이스를 제공합니다.
호환성
SEA.JS는 완전한 테스트 사례가 있으며 모든 주류 브라우저와 호환됩니다.
크롬 3+
Firefox 2+
사파리 3.2+
오페라 10+
IE 5.5+
SEA.JS는 하이브리드 모드 앱을 포함하여 모바일 측면에서 실행할 수 있습니다. 이론적으로 Sea.js는 모든 브라우저 엔진에서 실행할 수 있습니다.
seajs.configobject
별칭 객체
별명 구성, 구성 후 요구 사항을 호출 할 수 있습니다 ( 'jQuery');
seajs.config ({alias : { 'jQuery': 'jQuery/jQuery/1.10.1/jQuery'}); define (함수 (요구, 내보내기, 모듈) {// 참조 jQuery 모듈 var $ = 요구 ( 'jQuery');});경로 개체
교차-디렉토리 호출을 용이하게하기위한 경로를 설정하십시오. 경로를 유연하게 설정하면베이스에 영향을 미치지 않고 특정 디렉토리를 지정할 수 있습니다.
Seajs.config ({// 경로 경로 설정 : { '갤러리': 'https://a.alipayobjects.com/gallery'}, // 별칭에 대한 호출을 용이하게하기 위해 별명을 설정합니다. define (함수 (요구, 내보내기, 모듈) {var _ = require ( 'aldscore'); // =>로드 된로드는 https://a.alipayoBjects.com/gallery/underscore.js});vars 객체
가변 구성. 일부 시나리오에서는 모듈 경로를 런타임 중에 만 결정할 수 있으며 Vars 변수를 사용하여 구성 할 수 있습니다.
Vars는 모듈 식별자의 변수 값으로 구성되며 변수는 모듈 식별자의 {key}로 표시됩니다.
seajs.config ({// 변수 구성 vars : { 'locale': 'zh-cn'}}); define (함수 (요구, 내보내기, 모듈) {var lang = 요구 ( './ i18n/{locale} .js'); // =>로드 된 것은/i18n/zh-cn.js});지도 배열
이 구성은 모듈 경로를 매핑하고 수정할 수 있으며 경로 변환, 온라인 디버깅 등에 사용할 수 있습니다.
seajs.config ({map : [[ '.js', '-debug.js']}); define (함수 (요구, 내보내기, 모듈) {var a = 요구 ( './ a'); // =>로드 된 것은 경로/a-debug.js});예압 배열
예압 구성 항목을 사용하면 정상 모듈을로드하기 전에 지정된 모듈을 미리로드하고 초기화 할 수 있습니다.
예압의 빈 문자열은 무시됩니다.
// 오래된 브라우저에서 ES5 및 JSON 모듈을로드하여 seajs.config ({preload : [function.prototype.bind? '': 'es5-safe', this.json? '': 'JSON']});참고 : 예압의 구성은 사용될 때까지로드해야합니다. 예를 들어:
seajs.config ({preload : 'a'}); // b를로드하기 전에 모듈 A가로드 및 실행되었는지 확인합니다 ( './ b');예압 구성은 모듈 파일에 배치 할 수 없습니다.
seajs.config ({preload : 'a'}); define (함수 (요구, 내보내기) {// 여기에서 실행할 때 모듈 A가로드 및 실행되었음을 보장 할 수 없습니다);부인 부울
값이 참이면 로더는 동적으로 삽입 된 스크립트 태그를 삭제하지 않습니다. 플러그인은 또한 디버그 구성을 기반으로 로그 및 기타 정보의 출력을 결정할 수도 있습니다.
기본 문자열
SEA.JS는 기본 경로에 비해 최상위 식별자를 구문 분석합니다.
참고 : 일반적으로 기본 경로를 구성하지 마십시오. SEA.JS를 적절한 경로에 넣는 것은 종종 더 단순하고 일관성이 있습니다.
charsetstring | 기능
모듈 파일을 얻을 때 <cript> 또는 <link> 태그의 charset 속성. 기본값은 UTF-8입니다
숯불도 기능이 될 수 있습니다.
seajs.config ({charset : function (url) {// xxx 디렉토리의 파일은 gbk 인코딩 if (url.indexof ( 'http://example.com/js/xxx'=== 0) {return 'gbk';} // utf-8에 인코딩되어 있습니다.seajs.use 기능
페이지에 하나 이상의 모듈을로드하는 데 사용됩니다. seajs.use (id, 콜백?)
// module seajs.use ( './ a'); // 모듈을로드하고, 콜백을 실행하고, 콜백 seajs.use ( './ a', function (a) {a.dosomething ();}); // 여러 모듈로드, 콜백을 실행합니다.참고 : Seajs.use는 DOM Ready 이벤트와 관련이 없습니다. DOM 준비 후 특정 작업을 실행 해야하는 경우 jQuery와 같은 클래스 라이브러리를 사용하여이를 확인해야합니다. 예를 들어
seajs.use ([ 'jquery', './main'], function ($, main) {$ (document) .ready (function () {main.init ();});});참고 : 사용 방법의 첫 번째 매개 변수는 있어야하지만 null 또는 변수 일 수 있습니다.
var bootstrap = [ 'bootstrap.css', 'bootstrap-responsive.css', 'bootstrap.js']; seajs.use (bootstrap, function () {// do do something});seajs.cache ojbect
Seajs.cache를 통해 현재 모듈 시스템에서 모든 모듈 정보를 확인할 수 있습니다.
예를 들어, seajs.org를 개방 한 다음 WebKit 개발자 도구의 콘솔 패널에 seajs.cache를 입력하면 다음을 볼 수 있습니다.
개체> http://seajs.org/docs/assets/main.js : x> https://a.alipayobjects.com/jquery/jquery/1.10.1/jquery.js : x> __proto__ : Object
이들은 문서의 홈페이지에 사용 된 모듈입니다. 모듈의 특정 정보를보기 위해 항목을 확장하십시오. 의미는 CMD 모듈 정의 사양의 모듈 섹션에서 찾을 수 있습니다.
Seajs.Reslove 기능
요구 사항과 유사하게 모듈 시스템의 내부 메커니즘은 들어오는 문자열 매개 변수의 경로 해상도를 사용합니다.
seajs.resolve ( 'jquery'); // => http : //path/to/jquery.jsseajs.resolve ( './a', 'http://example.com/to/b.js';// => http://example.com/to/a.js
Seajs.Resolve 방법을 사용하여 경로 해상도가 올바른 지 디버깅 할뿐만 아니라 플러그인 개발 환경에서도 디버깅 할 수 있습니다.
seajs.data 객체
Seajs.data를 통해 모든 SEAJS 구성과 플러그인 개발에 사용할 수있는 일부 내부 변수의 값을 볼 수 있습니다. 로딩 문제가 발생할 때 디버깅에 사용할 수도 있습니다.
자주 묻는 질문
모듈 식별 정보
SEAJS 모듈 식별자는 주로 작은 낙타 문자열입니다. 또는 ..
// http://example.com/js/a.js의 공장에서 : require.resolve ( './ b'); // => http://example.com/js/b.js// http://example.com/js/a.js의 공장에서 : require.resolve ( '../ c'); // => http://example.com/c.js
상대 및 최상위 로고로 나뉩니다. 시작하는 경우. 또는, 그것은 상대 식별자입니다. 작은 낙타 문자열 스위치는 최상위 식별자입니다.
// 기본 경로가 다음과 같이 가정합니다 : 모듈 코드에서 http://example.com/assets///////solve ( 'Gallery/JQuery/1.9.1/jQuery'); // => http://example.com/assets/gallery/jquery/1.9.1/jquery.js
길에 대해
SEAJS는 상대적으로 높은 수준의 식별 일뿐 만 아니라 정상 경로를 사용하여 하중 모듈을 사용할 수 있습니다.
현재 페이지의 스크립트 분석으로 이동하겠습니다 (소스 코드를 보려면 마우스 오른쪽 버튼을 클릭 할 수 있습니다).
// Sea.js의 경로는 기본 경로에 적용됩니다. 현재 페이지 <script src = "http://yslove.net/actjs/assets/sea-modules/seajs/2.1.js"> </script> <script> <script> <script> <text/javascript "> // configure seajssseeajssseajssseajssseajss.s.s.s.sonfig. // 기본 경로 'ACTJS'를 기반으로 한 최상위 식별 : 'ACTJS/CORE/0.0.7/CORE.JS', // => http : // http : // 'position': 'actjs/util/0.0.2/position.js'}); Seajs.config ({// 정상 경로, 현재 페이지와 관련하여 ': '../../actjs/assets/widget/src/widget-affix.js', // 상대 식별자, 현재 페이지 'init': './src/init.js'}}); </script>처음에, 나는 Seajs 경로가 기본 경로이기 때문에 그것에 약간 익숙하지 않다고 생각합니다. 기본 경로는 SEA.JS에서 파일의 상단 경로이며 모든 최상위 식별자 및 상대 식별자는이 기본에 비해 조정됩니다.