.about{@applylg:min-h-screenlg:flexlg:items-center;h1{@applytext-xlfont-mediumtext-white;}}寰俊鎼滅储銆愬ぇ鍗冧笘鐣屻€戯紝鍓嶇琛屼笟鍔ㄦ€併€佸涔犺矾寰勭瓑绗竴鏃堕棿涓庡ぇ瀹跺垎浜€傛湰鏂囧凡鏀跺綍鍒癎itHubhttps://github.com/qq449245884/xiaozhi锛岄噷闈㈡湁瀹屾暣鐨勬祴璇曠珯鐐广€佽祫鏂欏拰鎴戠殑涓€绾垮巶鍟嗚璋堢郴鍒楁枃绔犮€備笉涔呭墠锛屾垜鎰忚瘑鍒版垜姝e湪灏嗕竴浜涙椂闂存氮璐瑰湪鍙噸鐢ㄧ殑鍚庣鍩虹妯℃澘涓婏紝鎴戠獊鐒舵兂鍒扳€斺€斾负浠€涔堜笉閲嶆柊鍒╃敤杩欎簺鍙噸鐢ㄧ殑閮ㄥ垎骞跺皢瀹冧滑绠€鍗曞湴鍫嗘斁鍦ㄤ竴涓ā鏉夸腑鍛紵馃鍦ㄦ妧鏈爤鐨勫悗鍙版ā鏉夸腑锛屼娇鐢ㄤ簡浠ヤ笅妗嗘灦鎴栧簱锛歏itePiniaVueRouterTailwindCSSViteSVGloaderPrerequisites寮€濮嬩箣鍓嶏紝蹇呴』鍏堝畨瑁匩ode.js锛岃嚜琛岀櫨搴﹁В鍐炽€傚揩閫熷叆闂?Vue,Router&Store鍏堜粠鍒濆鍖栨ā鏉垮紑濮嬶細npminitvue@latest鐒跺悗杈撳叆椤圭洰鍚嶇Оvue3-boilerplate锛岀劧鍚庡湪鍔熻兘鎻愮ず涓€夋嫨瀹夎Pinia鍜孷ueRouter锛氣湐椤圭洰鍚嶇О锛歷ue3-boilerplate...鉁斾负鍗曢〉搴旂敤绋嬪簭寮€鍙戞坊鍔燰ue璺敱鍣紵鏄湐娣诲姞Pinia杩涜鐘舵€佺鐞嗭紵鏄牴鎹彁绀猴紝閫夋嫨闇€瑕佺殑鍔熻兘鍚庯紝鎵ц浠ヤ笅鍛戒护锛歝dvue3-boilerplatenpminstallnpmrundev杩愯鍚庯紝鍦ㄦ湰鍦板紑鍙戠幆澧冧腑鏌ョ湅http:///127.0.0.1:5173鏈ず渚嬮〉闈細AddingTailwindCSSNow鎴戜滑鏈変簡鍩虹锛屾垜浠渶瑕佷竴浜涢€犲瀷銆傛寜鐓ф湰鎸囧崡锛屾垜浠畨瑁匱ailwindCSS锛岀劧鍚庡垵濮嬪寲閰嶇疆鏂囦欢銆俷pminstall-Dtailwindcsspostcssautoprefixernpxtailwindcssinit-p瀹夎瀹屾垚鍚庯紝鏍圭洰褰曚笅浼氭湁涓€涓猼ailwind.config.js鏂囦欢锛屽~鍏呭唴瀹瑰涓嬶細/**@type{import('tailwindcss').Config}*/module.exports={content:["./index.html","./src/**/*.{vue,js,ts,jsx,tsx}"],theme:{extend:{},},鎻掍欢:[],};鎺ヤ笅鏉ワ紝鎴戜滑闇€瑕佸姞杞紷tailwind鎸囦护锛屾墍浠ュ湪/src/assets鏂囦欢澶逛腑鍒涘缓tailwind.css锛屽叾涓寘鍚互涓嬪唴瀹癸紙鎸囦护锛夛細@tailwindbase;@tailwindcomponents;@tailwindutilities;鐒跺悗鍦?src/assets/main.css鐨勯《閮ㄥ鍏ュ畠锛欯import"./tailwind.css";鐢变簬鎴戜滑宸茬粡鍦?src/main.js涓鍏ヤ簡/src/assets/main.css鏂囦欢锛屾墍浠ワ紝鐜板湪鎮ㄥ彲浠ュ湪鎮ㄧ殑椤圭洰涓娇鐢═ailwind鐨勫疄鐢ㄧ▼搴忕被銆傛垜浠湪/src/views/AboutView.vue涓殑h1鏍囩涓坊鍔犱竴浜涘疄鐢ㄧ被杩涜娴嬭瘯锛?template>杩欐槸鍏充簬椤甸潰
鎴戜滑涔熷彲浠ュ湪涓嬮潰鍗曠嫭瀹氫箟鎴戜滑鐨凜SS灞炴€с€備负姝わ紝鎮ㄩ渶瑕佸畨瑁呮PostCSS鎻掍欢-postcss-import銆俷pminstall-Dpostcss-import鎺ヤ笅鏉ワ紝浣跨敤@apply: