涓婁竴绡囨垜浠璁轰簡newVue({...})鑳屽悗鍙戠敓浜嗕粈涔堛€傞偅涔堟垜浠疄渚嬪寲vue涔嬪悗dom鎸傝浇鏄€庝箞鍥炰簨鍛紵缁嗗績鐨勫悓瀛︿細鍙戠幇$mount鏂规硶瀹氫箟鍦ㄥ涓枃浠朵腑锛屾瘮濡傦細src/platform/web/entry-runtime-with-compiler.jssrc/platform/web/runtime/index.jssrc/platform/weex/runtime鐨?index.js涔嬫墍浠ユ湁澶氫釜鍦版柟锛屾槸鍥犱负$mount鐨勫疄鐜颁笌骞冲彴鍜屾瀯寤烘柟寮忔湁鍏炽€備笅闈紝鎴戜滑閫夋嫨缂栬瘧鍣ㄧ増鏈垎鏋?.$mount鐨勪富瑕佷唬鐮佸涓嬶細Vue.prototype.$mount=function(el?:string|Element,hydrating?:boolean):Component{el=el&&query(el)//鏌ヨ鏂规硶瀹為檯涓婂el鍙傛暟杩涜浜嗚浆鎹紝el鍙互鏄痵tring涔熷彲浠ユ槸element銆傚鏋滃畠鏄竴涓瓧绗︿覆锛屽畠灏嗚繑鍥瀌ocument.querySelector(el)//...constoptions=this.$optionsif(!options.render){//render鍑芥暟涓嶅瓨鍦╨ettemplate=options.templateif(template){//濡傛灉鏈夋ā鏉块厤缃」锛?/1.妯℃澘鍙兘鏄€?xx鈥濓紝鍒欐牴鎹甶d鑾峰彇鍏冪礌鍐呭//2.濡傛灉妯℃澘鏈塶odeType锛屽垯鑾峰彇妯℃澘.innerHTMLcontent}else{//濡傛灉妯℃澘閰嶇疆椤规病鏈夋ā鏉匡紝浣嗘槸鏈塭l:/**渚嬪锛歯ewVue({*el:"#app",*...*})**///鐒跺悗鏍规嵁el寰楀埌鐩稿簲鐨勫厓绱犲唴瀹箎//缁忚繃涓婇潰鐨勫鐞嗭紝浠ュ緱鍒扮殑妯℃澘涓哄弬鏁拌皟鐢╟ompileToFunctions鏂规硶//compileToFunctions鏂规硶浼氳繑鍥瀝ender鍑芥暟鏂规硶锛宺ender鏂规硶浼氫繚瀛樺湪vm.$optionsconst{render,staticRenderFns}=compileToFunctions(template,{...})options.render=render}returnmount.call(this,el,hydrating)}浠庝富瑕佷唬鐮侊紝鎴戜滑鍙互鐪嬪埌鍋氫簡浠ヤ笅浜嬫儏銆傜敱浜巈l鍙傛暟鏈変袱绉嶇被鍨嬶紝鍙兘鏄痵tring涔熷彲鑳芥槸element锛岃皟鐢╭uery鏂规硶缁熶竴杞崲濡傛灉娌℃湁鎵嬪啓Element绫诲瀷鐨剅ender鍑芥暟锛屽厛鑾峰彇妯℃澘鍐呭銆傜劧鍚庝互妯℃澘涓哄弬鏁帮紝璋冪敤compileToFunctions鏂规硶锛岃繑鍥瀝ender鍑芥暟銆傛渶鍚庤皟鐢╩ount.call锛屽叾瀹炲氨鏄皟鐢ㄤ簡runtime/index.js鐨刴ount鏂规硶銆傛敞鎰忥細vue缂栬瘧鍣ㄦ湁涓や釜鐗堟湰锛氫竴涓槸build-time鐗堟湰锛屼篃灏辨槸鎴戜滑浣跨敤vue-loader+webpack銆傚彟涓€绉嶇増鏈槸锛歳untime鐗堟湰锛岃繍琛岀殑鏃跺€欙紝鍘荤紪璇戝櫒鍘昏В鏋愩€傛垜浠繖閲屽垎鏋愮殑鏄紝Vue鏈€缁堝彧鑳借瘑鍒繍琛屾椂鐨剅ender鍑芥暟锛屾墍浠ュ鏋滄垜浠墜鍔ㄥ啓render鍑芥暟锛岄偅涔堢洿鎺ヨ皟鐢╩ount.call銆傜浉鍙嶏紝vue浼氫互妯℃澘涓哄弬鏁帮紝鍦ㄨ繍琛屾椂璋冪敤compileToFunctions鏂规硶锛岃浆鎹㈡垚render鍑芥暟锛岀劧鍚庤皟鐢╩ount.call鏂规硶銆傚鏋滄槸build-time鐗堟湰锛寁ue-loader+webpack浼氬厛鎶婃垜浠湰鍦扮殑浠ｇ爜杞垚render鍑芥暟锛宺un浼氱洿鎺ヨ皟鐢╩ount.call銆傚浜庣敓浜х幆澧冿紝鎴戜滑鎺ㄨ崘鏋勫缓鏃剁増鏈€備釜浜哄涔犳帹鑽愯繍琛屾椂鐗堟湰銆俶ount.call鏂规硶瀹為檯涓婁細璋冪敤runtime/index.js涓嬬殑$mount鏂规硶锛岃繖涓柟娉曞緢绠€鍗曪紝灏辨槸璋冪敤mountComponent鏂规硶銆?銆乵ountComponent涓昏浠ｇ爜濡備笅锛歟xportfunctionmountComponent(vm:Component,el:?Element,hydrating?:boolean):Component{//...//璋冪敤beforeMount鐢熷懡鍛ㄦ湡鍑芥暟callHook(vm,'beforeMount')//...//瀹氫箟updateComonent鏂规硶letupdateComponent=()=>{vm._update(vm._render(),hydrating)}//...newWatcher(vm,updateComponent,noop,{before(){if(vm._isMounted&&!vm._isDestroyed){callHook(vm,'beforeUpdate')}}},true)//...//璋冪敤鐢熷懡鍛ㄦ湡鍑芥暟mountedcallHook(vm,'mounted')}Watch绫荤浉鍏充唬鐮乄atch绫荤殑閫昏緫寰堝锛岃繖閲屾垜浠彧鐪嬩笌$mount:classWatcher{constructor(vm:Component,expOrFn:string|Function,cb:Function,options?:?Object,isRenderWatcher?:boolean){//...if(typeofexpOrFn==='function'){this.getter=expOrFn}else{//...}//...this.value=this.lazy锛焨ndefined:this.get()}get(){//...value=this.getter.call(vm,vm)//...//鍚庨潰浼氬垎鏋恈leanupDeps鏂规硶锛岃繖涓湪鎬ц兘浼樺寲杩斿洖鍊间腑姣旇緝閲嶈锛泒}浠庝笂闈㈢殑浠ｇ爜鍙互鐪嬪嚭锛氶鍏堣皟鐢╞eforeMounthook鍑芥暟锛屽皢updateComponent鏂规硶浣滀负鍙傛暟锛屽疄渚嬪寲WatchWatch鏈変袱涓綔鐢細1.鍥炶皟鍑芥暟浼氬湪鍒濆鍖栨椂鎵ц銆?銆佸綋vm瀹炰緥涓洃鎺х殑鏁版嵁鍙戠敓鍙樺寲鏃讹紝浼氭墽琛屽洖璋冨嚱鏁般€傝繖閲屽厛鐪嬬1涓紝绗?涓細鍦ㄦ暟鎹彉鍖栫洃鎺х珷鑺傚垎鏋愩€傛墽琛屽洖璋冨悗锛屾垜浠湅鍒皏m._update(vm._render(),hydrating)鏂规硶銆傝鏂规硶鍒嗕负2姝ワ細锛?锛夋墽琛宺ender鏂规硶锛岃繑鍥炴渶鏂扮殑VNode鑺傜偣Tree锛?锛夎皟鐢╱pdate鏂规硶锛屽疄闄呮瘮杈僤iff绠楁硶锛岃皟鐢ㄦ寕杞界殑閽╁瓙鍑芥暟杩涜涓€娆℃覆鏌撱€?.鎬荤粨options涓婃病鏈塺ender鍑芥暟锛屽template鍜宔l杩涜澶勭悊锛岃幏鍙栨ā鏉垮唴瀹广€傝皟鐢╟ompileToFunctions鏂规硶鑾峰彇render鍑芥暟锛屾坊鍔犲埌options.render涓皟鐢╩ount.call锛屽叾瀹炲氨鏄皟鐢╩ountComponent鍑芥暟璋冪敤beforeMounthook瀹炰緥鍖杛enderingwatcher锛屾墽琛屽洖璋冭幏鍙朧Node鑺傜偣鏍戯紙瀹為檯涓婃槸涓€涓猨s瀵硅薄锛夋牴鎹覆鏌撳姛鑳姐€倁pdate鏂规硶鍏跺疄灏辨槸涓€涓猵atch鐨勮繃绋嬨€俈ue浼氭墽琛宒iff绠楁硶鏉ュ畬鎴愪竴娆℃覆鏌撳苟璋冪敤mounted閽╁瓙銆傚湪鍚庨潰鐨勭珷鑺備腑锛屾垜浠細涓€涓€鍒嗘瀽锛歊esponsive銆乧ompileToFunctions銆乿irtualDOM銆乸atch鐮佸瓧閮戒笉瀹规槗锛屽澶氬叧娉▇馃樈
