鍓嶈█2016骞撮『涓板彂琛ㄦ枃绔犮€婃帰绱egumentFaultMarkdown缂栬緫鍣ㄣ€嬶紝鐩殑鏄ā浠块『涓板湪绾垮啓Markdown鏂囨。鐨勪綋楠岋細楂樹寒瀹氫綅鍜宮odifyingnodesin涓婇潰鏂囩珷涓殑宸ュ叿宸茬粡涓嶅啀缁存姢锛堭煒唬鐮佸お涔憋級锛屽湪娴忚鍣ㄤ腑鍐檓arkdown鏂囨湰銆傛墍浠ョ幇鍦ㄦ垜浠敤涓€涓叏鏂扮殑鎬濊矾鏉ュ疄鐜颁竴涓細鍦ㄦ湰鍦颁换鎰忎竴涓紪杈戝櫒涓紪鍐檓arkdown锛屽悓鏃跺畾浣嶅苟淇敼node宸ュ叿live-markd鐨勯瑙堟晥鏋滃鍥撅細濡備綍浣跨敤鍜屽畨瑁卬odejs鐜锛屽鏋滃凡缁忔湁浜嗭紝璺宠繃杩欎竴姝ュ畨瑁卨ive-鍏ㄥ眬markdnpminstalllive-markd-g杩涘叆markdown鏂囦欢鐩綍live-markdpath/to/markdown濡備綍瀹炵幇濡備綍瀹炵幇淇敼鑺傜偣妫€娴嬩娇鐢╮emark瑙ｆ瀽markdown鍒拌幏鍙杕arkdown鎶借薄璇硶鏍戜笅闈㈢殑渚嬪瓙锛岀幇鍦ㄦ湁涓や釜markdown鏂囦欢old.md鍜宯ew.mdold.md#hiworldnew.md#hiworld锛佸彲浠ョ湅鍒版渶鍚巒ew.md姣攐ld.md澶氫簡寰堝锛佽繘涓€姝ワ紝姣旇緝涓や釜markdown鏂囨湰鐨勮娉曟爲{type:'text',value:'world'}]}]}]}//new.md{type:'root',children:[{type:'heading',depth:1,children:[{type锛?娈佃惤'锛屽瀛愪滑锛歔{绫诲瀷锛?鏂囨湰'锛屼环鍊硷細'涓栫晫锛?}]}]}]}鐒跺悗鍒嗗埆瀵逛袱涓爲缁撴瀯杩涜DFS锛屼緷娆℃瘮杈冭妭鐐癸紝鍒ゆ柇绗竴涓笉鍚岀殑鑺傜偣銆傛渶鍚庡湪淇敼鍚庣殑鑺傜偣涓敞鍏lass锛屾渶鍚庤浆鎴恏tmlwithclass{hProperties:{className:['detected-updated']},type:'paragraph',children:[{type:'text',value:'涓栫晫锛?}]}

鍡?/h1>world!

褰撶劧锛屼笂闈㈢殑markdown瀵规瘮宸ヤ綔鏄€氳繃detect-one-changed瀹屾垚鐨勫浣曞疄鐜版暟鎹帹閫丩ive-markd鏄娇鐢ㄦ湇鍔″櫒鎺ㄩ€侊紙EventStream锛夋潵瀹炵幇client涓庢湇鍔″櫒鐨勯暱鏈熻繛鎺ワ紝绫讳技webpack-hot-middleware鐨勫疄鐜般€備粠鏈嶅姟鍣ㄥ埌瀹㈡埛绔彧鏈夊崟鍚戞暟鎹帹閫併€傚悓鏃讹紝涓轰簡璁╂湇鍔＄鐭ラ亾瀹㈡埛绔槸鍚﹁繕瀛樺湪锛岃繕姣?0s妫€娴嬩竴娆″績璺筹紝鍙婃椂鎭㈠銆傛湇鍔″櫒璧勬簮銆傚鎴风鍙渶瑕佸湪瀹㈡埛绔帴鍙楁湇鍔″櫒绔帹閫佺殑鏁版嵁鍗冲彲銆?/寤虹珛杩炴帴constsource=newEventSource(location.pathname+'?sse=on')source.addEventListener('message',function(ev){letdata={}try{data=JSON.parse(ev.data)}catch(e){}if(data.type==='change'){document.querySelector('.markdown-body').innerHTML=data.valueconstnode=document.querySelector('.markdown-body.detected-updated')if(node){//瀹氫綅node.scrollIntoView({behavior:'smooth'})}}})骞舵敞鍏ラ珮浜牱寮忥細@keyframesbling{from{background-color:#d9edf7;}鍒皗鑳屾櫙棰滆壊锛?d9edf7;}}.markdown-body.detected-updated{animation:bling2.5s1;}鏈€鍚庯紝鍦╩dx鐢熸€佷腑锛岃繖涓姛鑳戒篃鏄彲浠ヤ娇鐢ㄧ殑锛岃瑙乨etect-one-changed銆俶dx-go鍜宒ocz涓兘鎻愪緵浜哖R鏉ヤ粙缁嶈繖娆＄殑缂栧啓浣撻獙锛佺瓑寰呬綔鑰呯殑鍥炲銆傛杩庡ぇ瀹禨tar:+1:锛乴ive-markd-GitHubmarkdownstyle鏈湴瀹炴椂鍐檓arkdown+鍚屾瀹氫綅淇敼鑺傜偣detect-one-changed-Markdown/Html淇敼妫€娴?/p>