锛屼篃灏辨槸缁檝uepress鍐欎釜鎻掍欢馃槉鏈€缁堟晥鏋滃涓嬨€傛渶杩戝湪鐪媝wa鐨勬椂鍊欙紝鍦∕DN涓婄湅鍒颁竴涓湁瓒ｇ殑鐗囨锛屾槸鍏充簬瀹炵幇娓愯繘寮忓浘鐗囧姞杞界殑銆傚ぇ浣撴€濊矾濡備笅锛歩mg=>{img.setAttribute('src',imgAttribute('data-src'));img.onload=()=>{img.removeAttribute('data-src')}})img[鏁版嵁婧怾{杩囨护鍣細妯＄硦锛?.2em锛夛紱}img{杩囨护鍣細妯＄硦锛?em锛夛紱杩囨浮锛氳繃婊?.3s锛涗竴鑸潵璇达紝鍦ㄥ姞杞藉拰娓叉煋椤甸潰鏃讹紝鍏堝姞杞芥覆鏌撻〉闈㈢殑缂╃暐鍥句綔涓哄崰浣嶇锛岀劧鍚庡啀鍔犺浇鐪熸鐨勫師鍥撅紝褰撳師鍥惧姞杞藉畬鎴愬悗锛屽啀娓叉煋鍘熷浘銆傝繖缂╃煭浜嗛〉闈㈠姞杞芥覆鏌撴椂闂达紝鍏佽鐢ㄦ埛鎵撳紑椤甸潰寰楀埌蹇€熷弽棣堛€傛垜浠彲鑳藉湪medium鍜実atsby.js缃戠珯涓婄湅鍒拌繃杩欑鍥剧墖鍔犺浇鏂瑰紡锛屼絾鏄痸uepress鏈韩鏄笉鏀寔鐨勶紝鎵€浠ユ垜浠兂瀹炵幇杩欑鍥剧墖鍔犺浇鏂瑰紡锛岄『渚垮啓涓€涓獀uepress鎻掍欢銆傚疄鐜版楠ゅ涓嬶細1.鐢熸垚缂╃暐鍥撅紝鐒跺悗鎻掑叆銆傛牴鎹渶姹傦紝鎴戜滑鎯宠杩欐牱鐨刴arkdown瑙ｆ瀽鏁堟灉锛乕image](./origin.jpg)瑙ｆ瀽鍚庝负锛?imgsrc="./thumbnial.jpg"data-src="./orign.jpg">棣栧厛闇€瑕佽鏄庝竴涓媣uepress鏄浣曞疄鐜扮殑椤甸潰鐢熸垚markdown-loadervue-loadermarkdown------------->vueSFCs?------>vuespa涓婇潰璇寸殑涓嶅噯纭紝鍥犱负娌℃湁娣卞叆鍒颁粈涔堜腑闂翠骇鍝佹槸銆傚洖鍒颁富绾匡紝瀹樼綉鏄剧ずvuepress浣跨敤markdonw-it浣滀负markdown瑙ｆ瀽鍣紝涔熷氨鏄笂闈㈣鐨刴arkdown-loader鍏跺疄鏄竴涓皝瑁呭ソ鐨刴arkdown-it锛屽悓鏃秜uepress鏆撮湶浜唀xtendMarkdown閲嶅啓markdown瑙ｆ瀽瑙勫垯鐨刟pi銆傚洜姝わ紝鎴戜滑鍙互閫氳繃杩欎釜API锛屾彃鍏ユ垜浠嚜瀹氫箟鐨勫浘鐗囪В鏋愯鍒欙紝鏉ヨ揪鍒版垜浠渶瑕佺殑缁撴灉銆傛墍浠ユ垜浠彲浠ュ啓涓€涓猰ark-it鎻掍欢鏉ュ疄鐜拌繖涓姛鑳姐€傚湪杩欓噷锛屾垜閬囧埌浜嗕袱涓櫡闃便€俶arkdown-it鎻掍欢鍙敮鎸佸悓姝ュ姛鑳姐€倂ue-loader榛樿涓嶈В鏋恉ata-src灞炴€с€傚洜涓簐uepres浣跨敤浜唘rl-loader锛屾墍浠ュ浘鐗囩瓑闈欐€佹枃浠朵細琚瓨鏀惧湪assets/images鏂囦欢澶逛腑锛屼絾鏄痙ata-src涓殑鍥剧墖鍦板潃鏄笉浼氬彉鐨勩€傜浜屼釜闈炲父瀹规槗澶勭悊銆傛垜浠彲浠ラ€氳繃chainWebpackAPI鏇存敼vuepress鐨剋ebpackconfig锛屽嵆鍦╲ueloader鐨則ransformAssetUrls涓坊鍔爄mg:["data-src"]銆傚浜庣敓鎴愬師濮嬪浘鍍忕殑绗竴涓缉鐣ュ浘锛屾垜浣跨敤浜唅mageThumbnail搴擄紝瀹冨彧鏀寔寮傛鏂规硶銆傛墍浠ユ垜浠渶瑕佹妸杩欎釜寮傛鏂规硶鍖呰鎴愪竴涓湡姝ｇ殑鍚屾鏂规硶銆傝繖閲屼娇鐢ㄤ簡涓€涓猟easync搴擄紝鍦╪ode搴曞眰鏆撮湶浜嗕竴涓猻leep()鏂规硶鏉ュ己鍒朵富绾挎寕璧凤紝鎻愬墠鎵ц浜嬩欢寰幆锛岀洿鍒颁簨浠跺惊鐜粨鏉燂紝鍐嶆墽琛屼富绾跨▼搴忓疄鐜板悓姝ャ€?銆佸姞杞藉師鍥捐繖涓€姝ワ紝鍙互浣跨敤clientRootMixinapi锛屽湪globalLayout.vue涓贩鍚堜竴涓叏灞€鏂规硶銆傚叿浣撲唬鐮佸彲浠ョ湅鎴戠殑github浠撳簱銆傜敱浜庢湰浜哄vuepress鎺ヨЕ涓嶆繁锛屾墍浠ユ湁浜涢儴鍒嗙殑瀹炵幇闈炲父骞肩锛岃€屼笖鏁翠釜浠ｇ爜涓嶆槸寰堜紭闆咃紝寰堝鏂规硶寰堟鏉匡紝娆㈣繋澶уpr鎴栬€呭啓浠ｇ爜瀹炵幇鏇村ソ馃憦銆傚彟澶栵紝鎴戞妸鎻掍欢涓婁紶鍒颁簡npm锛屽ぇ瀹跺彲浠pminstall鐜╃帺~$npminstallvuepress-plugin-progressive-image-loader
