构建和维护大型Vue.js项目的10个最佳实践

杩欎簺鏄垜鍦ㄥ鐞嗗叿鏈夊ぇ鍨嬩唬鐮佸簱鐨刅ue椤圭洰鏃跺紑鍙戠殑鏈€浣冲疄璺点€傝繖浜涙妧宸у皢甯姪鎮ㄥ紑鍙戞洿楂樻晥銆佹洿鏄撲簬缁存姢鍜屽叡浜殑浠ｇ爜銆傚湪鎴戜粖骞寸殑鑷敱鑱屼笟鐢熸动涓紝鎴戞湁鏈轰細寮€鍙戜竴浜涘ぇ鍨媀ue搴旂敤绋嬪簭銆傛垜璇寸殑杩欎釜椤圭洰鏈夎秴杩?2涓猇uex鍟嗗簵銆佸緢澶氱粍浠讹紙鏈夋椂鏁扮櫨涓級鍜屽緢澶氳鍥撅紙椤甸潰锛夈€備簨瀹炰笂锛岃繖瀵规垜鏉ヨ鏄竴娆￠潪甯告湁鐩婄殑缁忓巻锛屽洜涓烘垜鍙戠幇浜嗚澶氫娇浠ｇ爜鍙墿灞曠殑鏈夎叮妯″紡銆傛垜杩樺繀椤讳慨澶嶄竴浜涘鑷磋憲鍚嶇殑鎰忓ぇ鍒╅潰鏉″紡浠ｇ爜鍥板鐨勪笉鑹仛娉曘€傪煃濇墍浠ワ紝浠婂ぉ锛屾垜灏嗕笌鎮ㄥ垎浜?0涓渶浣冲疄璺碉紝濡傛灉鎮ㄦ鍦ㄥ鐞嗗ぇ鍨嬩唬鐮佸簱锛屾垜寤鸿鎮ㄩ伒寰繖浜涙渶浣冲疄璺点€傦笍1.浣跨敤鎻掓Ы璁╃粍浠舵洿瀹规槗鐞嗚В鍜屾洿寮哄ぇ鎴戞渶杩戝啓浜嗕竴绡囨枃绔狅紝娑电洊浜嗕竴浜涘叧浜嶸ue.js涓殑鎻掓Ы浣犻渶瑕佺煡閬撶殑閲嶈浜嬫儏銆傚畠鐫€閲嶄簬鎻掓Ы濡備綍浣挎偍鐨勭粍浠舵洿鏄撲簬閲嶇敤鍜屾洿鏄撲簬缁存姢锛屼互鍙婁负浠€涔堝簲璇ヤ娇鐢ㄥ畠浠€傪煣愪絾杩欎笌澶у瀷Vue.js椤圭洰鏈変粈涔堝叧绯伙紵涓€鍥鹃《涓€鍗冨瓧锛岀粰浣犵敾涓€寮狅紝绗竴娆″悗鎮旀病鐢ㄣ€傛湁涓€澶╋紝鎴戝彧闇€瑕佸垱寤轰竴涓脊鍑虹獥鍙ｃ€備箥涓€鐪嬶紝娌′粈涔堝鏉傜殑锛屽彧鏄寘鎷爣棰樸€佹弿杩板拰涓€浜涙寜閽€傛墍浠ユ垜瑕佸仛鐨勬槸灏嗘墍鏈夊唴瀹归兘瑙嗕负灞炴€с€傛渶鍚庯紝鎴戜娇鐢ㄤ簡涓変釜灞炴€ф潵鑷畾涔夌粍浠跺苟鍦ㄤ汉浠崟鍑绘寜閽椂鍙戝嚭涓€涓簨浠躲€傚緢绠€鍗曠殑锛侌煒庣劧鑰岋紝闅忕潃椤圭洰鐨勪笉鏂彂灞曪紝鍥㈤槦瑕佹眰鎴戜滑鍦ㄥ叾涓樉绀鸿澶氬叾浠栨柊鍐呭锛氳〃鍗曞瓧娈点€佷笉鍚岀殑鎸夐挳锛堝彇鍐充簬瀹冩樉绀哄湪鍝釜椤甸潰涓婏級銆佸崱鐗囥€侀〉鑴氬拰鍒楄〃銆傛垜鍙戠幇锛屽鏋滄垜缁х画浣跨敤props鏉ユ墿灞曡繖涓粍浠讹紝瀹冧技涔庝篃鑳芥甯稿伐浣溿€備絾鏄笂甯濓紝馃槱鎴戦敊浜嗭紒璇ョ粍浠跺緢蹇彉寰楀お澶嶆潅鑰岄毦浠ョ悊瑙ｏ紝鍥犱负瀹冨寘鍚棤鏁扮殑瀛愮粍浠讹紝浣跨敤浜嗗お澶氱殑閬撳叿骞跺彂鍑轰簡澶ч噺鐨勪簨浠躲€傪煂嬫垜閬囧埌杩囦竴涓彲鎬曠殑鎯呭喌锛屽綋浣犲湪鏌愬杩涜鏇存敼鏃讹紝瀹冩渶缁堜細浠ユ煇绉嶆柟寮忕牬鍧忓彟涓€涓〉闈笂鐨勫叾浠栧唴瀹广€傛垜鍋氫簡涓€涓紬鍏拌偗鏂潶鐨勬€墿鑰屼笉鏄竴涓彲缁存姢鐨勭粍浠讹紒馃浣嗘槸锛屽鏋滄垜浠庝竴寮€濮嬪氨渚濊禆鎻掓Ы鍙兘浼氭洿濂姐€傛渶鍚庯紝鎴戦噸鏋勪簡鎵€鏈夊唴瀹逛互鎻愪緵姝ゅ皬閮ㄤ欢銆傛洿鏄撲簬缁存姢銆佹洿蹇悊瑙ｅ拰鏇村叿鍙墿灞曟€э紒鎴戠殑瑙傜偣鏄牴鎹粡楠岋紝涓€涓敱鐭ラ亾浣曟椂浣跨敤鎻掓Ы鐨勫紑鍙戜汉鍛樻瀯寤虹殑椤圭洰纭疄瀵瑰叾鏈潵鐨勫彲缁存姢鎬ф湁寰堝ぇ鐨勫奖鍝嶃€傝繖鍑忓皯浜嗗彂鍑虹殑浜嬩欢鏁伴噺锛屼娇浠ｇ爜鏇存槗浜庣悊瑙ｏ紝骞跺厑璁告洿鐏垫椿鍦版樉绀烘偍鎯宠鐨勪换浣曞唴閮ㄧ粍浠躲€傗殸锔忎綔涓轰竴涓粡楠屾硶鍒欙紝璇疯浣忥紝褰撳瓙缁勪欢鐨勫睘鎬ф渶缁堣澶嶅埗鍒板叾鐖剁粍浠朵腑鏃讹紝搴斾粠姝ゆ椂寮€濮嬩娇鐢ㄦ彃妲姐€?.姝ｇ‘缁勭粐浣犵殑Vuex瀛樺偍閫氬父锛屾柊鐨刅ue.js寮€鍙戜汉鍛樺紑濮嬪涔燰uex鏄洜涓轰粬浠伓鐒跺彂鐜颁簡浠ヤ笅涓や釜闂锛氫粬浠涔堥渶瑕佽闂粰瀹氱殑缁勪欢鏁版嵁锛岃涔堜粬浠渶瑕佸湪缁勪欢鐮村潖鍚庝粛鐒跺瓨鍦ㄧ殑鏁版嵁銆傚氨鍦ㄩ偅鏃讹紝浠栦滑鍒涘缓浜嗕粬浠殑绗竴涓猇uex鍟嗗簵锛屼簡瑙ｄ簡妯″潡锛屽苟寮€濮嬪湪搴旂敤绋嬪簭涓繘琛岀粍缁囥€傪煉￠棶棰樻槸鍒涘缓妯″潡鏃舵病鏈夊崟涓€鐨勬ā寮忓彲寰€備絾鏄紝馃憜馃徏鎴戝己鐑堝缓璁綘鑰冭檻涓€涓嬪浣曠粍缁囧畠浠€傛嵁鎴戜簡瑙ｏ紝澶у鏁板紑鍙戜汉鍛樺枩娆㈡寜鍔熻兘缁勭粐瀹冧滑銆傜ず渚嬶細CAPTCHA鍗氬鏀朵欢绠辫缃氨鎴戣€岃█锛屾垜鍙戠幇鏍规嵁浠嶢PI涓彁鍙栫殑鏁版嵁妯″瀷鏉ョ粍缁囧畠浠洿瀹规槗鐞嗚В銆備緥濡傦細鐢ㄦ埛鏁伴噺鍥㈤槦娑堟伅鍐呭灏忛儴浠舵枃绔犳偍閫夋嫨鍝竴涓敱鎮ㄥ喅瀹氥€傚敮涓€瑕佽浣忕殑鏄紝涓€涓粍缁囪壇濂界殑Vuexstore浠庨暱杩滄潵鐪嬪皢浣垮洟闃熸洿鏈夋晥鐜囥€傝繖涔熷皢浣挎柊浜哄湪鍔犲叆鎮ㄧ殑鍥㈤槦鍚庢洿瀹规槗灏嗘敞鎰忓姏闆嗕腑鍦ㄦ偍鐨勪唬鐮佸簱涓娿€?.浣跨敤鍔ㄤ綔锛圴uexActions锛夎繘琛孉PI璋冪敤鍜屾彁浜ゆ暟鎹垜鐨勫ぇ閮ㄥ垎API璋冪敤锛堝鏋滀笉鏄叏閮級閮芥槸鍦ㄦ垜鐨刅uex鍔ㄤ綔锛坴uexactions锛変腑杩涜鐨勩€備綘鍙兘鎯崇煡閬擄細涓轰粈涔堣繖涓皟鐢ㄦ洿濂斤紵馃え鍙槸鍥犱负瀹冧滑涓殑澶у鏁伴兘鑾峰彇浜嗘垜闇€瑕佸湪鍟嗗簵锛坴uex鍟嗗簵锛変腑鎻愪氦鐨勬暟鎹€傚彟澶栵紝瀹冧滑鎻愪緵浜嗘垜闈炲父鍠滄鐨勫皝瑁呭拰鍙噸鐢ㄦ€с€傛垜杩欐牱鍋氳繕鏈夊叾浠栦竴浜涘師鍥狅細濡傛灉鎴戦渶瑕佸湪涓や釜涓嶅悓鐨勫湴鏂癸紙渚嬪鍗氬鍜岄椤碉級鑾峰彇涓€绡囨枃绔犵殑绗竴椤碉紝閭ｄ箞鍙互浣跨敤姝ｇ‘鐨勫弬鏁拌皟鐢ㄩ€傚綋鐨勮皟搴︾▼搴忋€傛暟鎹皢琚彁鍙栥€佹彁浜ゅ拰杩斿洖锛岄櫎浜嗚皟搴︾▼搴忚皟鐢ㄤ箣澶栨病鏈夐噸澶嶇殑浠ｇ爜銆傚鏋滄垜闇€瑕佸垱寤轰竴浜涢€昏緫鏉ラ伩鍏嶅湪鑾峰彇绗竴椤垫椂鑾峰彇绗竴椤碉紝鎴戝彲浠ュ湪涓€涓湴鏂瑰畬鎴愩€傞櫎浜嗗噺灏戞湇鍔″櫒涓婄殑璐熻浇澶栵紝鎴戠浉淇″畠鍦ㄤ换浣曞湴鏂归兘鑳芥甯稿伐浣溿€傛垜鍙互鍦ㄨ繖浜涙搷浣滐紙vuex鎿嶄綔锛変腑璺熻釜鎴戠殑澶ч儴鍒哅ixpanel浜嬩欢锛屼粠鑰屼娇鍒嗘瀽浠ｇ爜搴撻潪甯稿鏄撶淮鎶ゃ€傛垜纭疄鏈変竴浜涘簲鐢ㄧ▼搴忥紝鍏朵腑鎵€鏈塎ixpanel璋冪敤閮芥槸鍦ㄦ搷浣滀腑鍗曠嫭杩涜鐨勩€傪煒傚綋鎴戜笉蹇呬簡瑙ｈ璺熻釜浠€涔堛€佷笉璺熻釜浠€涔堜互鍙婁綍鏃跺彂閫佹椂锛屼互杩欑鏂瑰紡宸ヤ綔缁欐垜甯︽潵浜嗗灏戜箰瓒ｃ€傝瘧娉細Mixpanel鏄竴瀹舵暟鎹拷韪垎鏋愬叕鍙革紝鍙互璁╁紑鍙戣€呰拷韪悇绉嶇敤鎴疯涓猴紝姣斿鐢ㄦ埛娴忚鐨勯〉闈㈡暟閲忋€乮Phone搴旂敤鍒嗘瀽銆丗acebook搴旂敤浜や簰銆丒mail鍒嗘瀽绛夈€傜被浼糉irebase鐨勫煁鐐瑰垎鏋愬伐鍏枫€?.浣跨敤mapState銆乵apGetters銆乵apMutations鍜宮apAction绠€鍖栨偍鐨勪唬鐮佸簱褰撴偍鍙渶瑕佽闂姸鎬?getter鎴栬皟鐢ㄧ粍浠跺唴閮ㄧ殑鎿嶄綔/鍙樻洿鏃讹紝鎮ㄩ€氬父涓嶉渶瑕佸垱寤哄涓绠楀睘鎬ф垨鏂规硶銆備娇鐢╩apState銆乵apGetters銆乵apMutations鍜宮apActions鍙互甯姪鎮ㄧ缉鐭唬鐮侊紝閫氳繃鍒嗙粍绠€鍖栧鏉傛€э紝骞朵粠妯″潡涓殑涓€涓湴鏂硅幏鍙栧叏灞€銆?/NPMimport{mapState,mapGetters,mapActions,mapMutations}from"vuex";exportdefault{computed:{//璁块棶鏍瑰睘鎬?..mapState("my_module",["property"]),//璁块棶getters...mapGetters("my_module",["property"]),//璁块棶闈炴牴灞炴€?..mapState("my_module",{property:state=>state.object.nested.property})},methods:{//璁块棶鍔ㄤ綔...mapActions("my_module",["myAction"]),//璁块棶绐佸彉...mapMutations("my_module",["myMutation"])}};JavaScriptVuex瀹樻柟鏂囨。涓烘偍鎻愪緵浜嗘湁鍏宠繖浜涙柟渚跨殑鍔╂墜鐨勬墍鏈変俊鎭€傪煠?銆備娇鐢ˋPI宸ュ巶锛屾垜閫氬父鍠滄鍒涘缓涓€涓姪鎵嬶紝鍙互鍦ㄤ换浣曞湴鏂硅皟鐢╰his.$api鏉ヨ幏鍙朅PI绔偣銆傚湪椤圭洰鐨勬牴鐩綍涓嬶紝鎴戞湁涓€涓寘鍚墍鏈夌被鐨刟pi鏂囦欢澶癸紙璇峰弬瑙佷笅闈㈢殑涓€涓級銆俛pi鈹溾攢鈹€auth.js鈹溾攢鈹€notifications.js鈹斺攢鈹€teams.js姣忎釜鑺傜偣灏嗗叾绫诲埆鐨勬墍鏈夌鐐瑰垎缁勩€傝繖灏辨槸鎴戜娇鐢ㄦ彃浠跺湪Nuxt搴旂敤绋嬪簭涓垵濮嬪寲姝ゆā寮忕殑鏂瑰紡锛堣繖涓庢爣鍑哣ue搴旂敤绋嬪簭涓殑杩囩▼闈炲父鐩镐技锛夈€?/椤圭洰锛欰PI浠庘€淍/api/auth鈥濆鍏uth锛涗粠鈥淍/api/teams鈥濆鍏eams锛涗粠鈥淍/api/notifications鈥濆鍏ラ€氱煡锛涘鍑洪粯璁ゅ€硷紙涓婁笅鏂囷紝娉ㄥ叆锛?>{if锛堝鐞?client){consttoken=localStorage.getItem("token");//瀹氫箟鏃惰缃护鐗宨f(token){context.$axios.setToken(token,"Bearer");}}//鍒濆鍖朅PI瀛樺偍搴揷onstrepositories={auth:Auth(context.$axios),teams:Teams(context.$axios),notifications:Notifications(context.$axios)};娉ㄥ叆锛堚€淎PI鈥濓紝瀛樺偍搴擄級锛泒锛汮avaScriptexportdefault$axios=>({forgotPassword(email){return$axios.$post("/auth/password/forgot",{email});},login(email,password){return$axios.$post("/auth/login",{email,password});},logout(){return$axios.$get("/auth/logout");},register(payload){return$axios.$post("/auth/register",璐熻浇);}});鐜板湪鎴戝彲浠ュ儚杩欐牱鍦ㄦ垜鐨勭粍浠舵垨Vuex鎿嶄綔涓畝鍗曞湴璋冪敤瀹冧滑锛歟xportdefault{me鏂规硶锛歿onSubmit(){灏濊瘯{this.$api.auth.login(this.email,this.password);}catch锛堥敊璇級{console.error锛堥敊璇級锛泒}}};JavaScript6銆備娇鐢?config璁块棶浣犵殑鐜鍙橀噺锛堝湪妯℃澘涓壒鍒湁鐢級浣犵殑椤圭洰鍙兘鍦ㄤ竴浜涙枃浠朵腑瀹氫箟浜嗕竴浜涘叏灞€閰嶇疆鍙橀噺锛歝onfig鈹溾攢鈹€development.json鈹斺攢鈹€production.json鎴戝枩娆㈤€氳繃this.$confighelperQuick璁块棶瀹冧滑锛屽挨鍏舵槸褰撴垜鍦ㄦā鏉夸腑鏃舵墿灞昖ue瀵硅薄涓€濡傛棦寰€鍦伴潪甯稿鏄擄細//PROJECT:COMMON浠庘€淍/config/development.json鈥濆鍏ュ紑鍙戯紱浠庘€淍/config/production.json鈥濆鍏ョ敓浜э紱if(process.env.NODE_ENV==="production"){Vue.prototype.$config=Object.freeze(production);}else{Vue.prototype.$config=Object.freeze(development);}JavaScript7.鎸夌収绾﹀畾缂栧啓鎻愪氦娉ㄩ噴闅忕潃椤圭洰鐨勫彂灞曪紝浣犻渶瑕佸畾鏈熸祻瑙堟彁浜や綘鐨勭粍浠剁殑鍘嗗彶銆傚鏋滄偍鐨勫洟闃熶笉閬靛惊鐩稿悓鐨勭害瀹氭潵缂栧啓浠栦滑鐨勬彁浜よ鏄庯紝閭ｄ箞灏嗗緢闅剧悊瑙ｆ瘡涓洟闃熸垚鍛樺湪鍋氫粈涔堛€傛垜鎬绘槸浣跨敤骞舵帹鑽怉ngular鎻愪氦娑堟伅鎸囧崡銆傛垜鍦ㄦ垜浠庝簨鐨勬瘡涓」鐩腑閮介伒寰畠锛屽湪璁稿鎯呭喌涓嬶紝鍏朵粬鍥㈤槦鎴愬憳寰堝揩涔熷彂鐜伴伒寰畠鏇村ソ銆傞伒寰繖浜涘噯鍒欎細浜х敓鏇村叿鍙鎬х殑娑堟伅锛屼粠鑰屽湪鏌ョ湅椤圭洰鍘嗗彶璁板綍鏃舵洿瀹规槗璺熻釜鎻愪氦銆傜畝鑰岃█涔嬶紝瀹冩槸杩欐牱宸ヤ綔鐨勶細gitcommit-am"():"#Herearesomesamplesgitcommit-am"docs(changelog):updatechangelogtobeta.5"gitcommit-am"fix(release):needtodependonlatestrxjsandzone.js"鏌ョ湅浠栦滑鐨凴EADME鏂囦欢浠ヨ幏寰楁洿澶氱害瀹氥€?.鎴戠煡閬撳湪鍒朵綔椤圭洰鏃跺缁堝喕缁撳寘鐨勭増鏈?..鎵€鏈夊寘閮藉簲閬靛惊璇箟鐗堟湰鎺у埗瑙勫垯銆備絾浜嬪疄鏄紝鍏朵腑涓€浜涘苟闈炲姝ゃ€傪煒变负浜嗛伩鍏嶅湪鍗婂閱掓潵鏃朵綘鐨勪竴涓緷璧栭」姣佷簡浣犵殑鏁翠釜椤圭洰锛岀増鏈攣瀹氫綘鎵€鏈夌殑鍖呭皢鍑忚交浣犳棭涓婄殑宸ヤ綔鍘嬪姏銆傪煒囧畠鐨勬剰鎬濆緢绠€鍗曪細閬垮厤鐗堟湰浠:{"name":"myproject","version":"1.0.0","private":true,"dependencies":{"axios":"0.19.0","imagemin-mozjpeg":"8.0.0","imagemin-pngquant":"8.0.0","imagemin-svgo":"7.0.0","nuxt":"2.8.1",},"devDependencies":{"autoprefixer":"9.6.1","babel-eslint":"10.0.2","eslint":"6.1.0","eslint-friendly-formatter":"4.0.1","eslint-loader":"2.2.1","eslint-plugin-vue":"5.2.3"}}9.闇€瑕佸湪缁欏畾椤甸潰鏄剧ず澶ч噺鏁版嵁鏃朵娇鐢╒ue铏氭嫙婊氬姩鏉℃偍鍙兘宸茬粡娉ㄦ剰鍒帮紝褰撳湪涓樉绀鸿澶氳鎴栭渶瑕侀亶鍘嗗ぇ閲忔暟鎹椂锛岄〉闈㈠憟鐜伴€熷害寰堝揩銆備负浜嗚В鍐宠繖涓棶棰橈紝鍙互浣跨敤vue-virtual-scoller銆俷pminstallvue-virtual-scroller鍙細娓叉煋鍒楄〃涓彲瑙佺殑item锛屽苟澶嶇敤缁勪欢鍜宒om鍏冪礌锛屽敖鍙兘楂樻晥銆傜湡鐨勫ソ鐢ㄥ張娴佺晠锛佲湪鐨凥TML10銆傝窡韪涓夋柟鍖呯殑澶у皬褰撹澶氫汉鍦ㄥ悓涓€涓」鐩笂宸ヤ綔鏃讹紝濡傛灉娌℃湁浜烘敞鎰忓畠浠紝鍒欏畨瑁呯殑杞欢鍖呯殑鏁伴噺浼氳繀閫熷鍔犲埌浠や汉闅句互缃俊鐨勫湴姝ャ€備负閬垮厤闄嶄綆鎮ㄧ殑搴旂敤绋嬪簭閫熷害锛堝挨鍏舵槸鍦ㄧЩ鍔ㄧ綉缁滈€熷害杈冩參鐨勬儏鍐典笅锛夛紝鎴戝湪VisualStudioCode涓娇鐢ㄤ簡瀵煎叆鏀惰垂鍖呫€傝繖鏍凤紝鎴戝彲浠ョ洿鎺ヤ粠缂栬緫鍣ㄤ腑鐪嬪埌瀵煎叆鐨勫簱鏈夊澶э紝骞朵笖鍙互鐪嬪埌瀵煎叆鐨勫簱澶ぇ鏃跺嚭浜嗕粈涔堥棶棰樸€備緥濡傦紝鍦ㄦ渶杩戠殑涓€涓」鐩腑锛屽鍏ヤ簡鏁翠釜lodash搴擄紙鍘嬬缉鍚庡ぇ绾?4kB锛夈€傞棶棰樻槸椤圭洰涓彧浣跨敤浜哻loneDeep鐨勪竴涓柟娉曘€傚湪瀵煎叆鏀惰垂鍖呬腑鍙戠幇姝ら棶棰樺悗锛屾垜浠€氳繃浠ヤ笅鏂瑰紡瑙ｅ喅浜嗗畠锛歯pmremovelodashnpminstalllodash.clonedeep鐒跺悗鍙互鍦ㄩ渶瑕佺殑鍦版柟瀵煎叆clonedeep鍑芥暟锛歩mportcloneDeepfrom"lodash.clonedeep";涓鸿繘涓€姝ヤ紭鍖朖avaScript锛屾偍杩樺彲浠ヤ娇鐢╓ebpackBundleAnalyzer鍖呴€氳繃浜や簰寮忓彲缂╂斁鏍戠姸鍥惧彲瑙嗗寲Webpack杈撳嚭鏂囦欢鐨勫ぇ灏忋€傚湪澶勭悊澶у瀷Vue浠ｇ爜搴撴椂锛屾偍杩樻湁鍏朵粬鏈€浣冲疄璺靛悧锛熻鍦ㄤ笅闈㈢殑璇勮涓憡璇夋垜锛屾垨鍦═witter@RifkiNada涓婁笌鎴戣仈绯汇€傪煠犲叧浜庝綔鑰匩adaRifkiNada鏄竴鍚岼avaScript寮€鍙戜汉鍛橈紝浠栧枩娆娇鐢║I缁勪欢鍒涘缓鍏锋湁鍑鸿壊UX鐨勭晫闈€傚ス涓撴敾Vue.js锛屽枩娆㈠垎浜换浣曞彲浠ュ府鍔╁ス鐨勫墠绔疻eb寮€鍙戜汉鍛樼殑涓滆タ銆侼ada杩樻秹瓒虫暟瀛楄惀閿€銆佽垶韫堝拰涓枃銆?/p>