leaa
v3.9.0
Leaa เป็น Monorepo CMS (ระบบการจัดการเนื้อหา) ที่สร้างขึ้นด้วย Nest.js, Next.js และ Ant Design
ดู README.md ของแต่ละไดเรกทอรีย่อยใน packages คุณอาจต้องดูพื้นที่ทำงานของเส้นด้ายก่อน
โทดอส
ในขั้นต้นควรเขียนบทสรุปในตอนท้ายของบทความ แต่ฉันรู้สึกว่าควรหยิบยกอย่างน้อยฉันก็ไม่ต้องอ่านจู้จี้ของฉันเกี่ยวกับบันทึกการพัฒนา
ฉันเคยคิดว่าฉันจะพยายามเชื่อมต่อกับ 5-end โดยการเขียนโปรเจ็กต์สแต็กเต็มรูปแบบด้วยตัวเอง ฉันไม่มีเวลาและลากมันต่อไป เมื่อฉันเขียนมันฉันคิดว่ามันจะใช้เวลามากกว่าครึ่งปี แต่ฉันไม่ได้คาดหวังว่าจะใช้เวลาเพียงหนึ่งเดือนครึ่งในการทำ และฉันก็หาแนวปฏิบัติที่ดีที่สุดในหลาย ๆ ที่และโดยรวมแล้วฉันก็ค่อนข้างพอใจ
ความตั้งใจดั้งเดิมของโครงการคือการใช้ React หรือส่วนใหญ่เป็นไวยากรณ์ JSX เพื่อทำสิ่งต่าง ๆ มากขึ้นเช่นการเขียนโปรแกรมหรือแอพขนาดเล็กและกรอบเทคนิคที่มีอยู่ยังสนับสนุนแนวคิดของฉันด้วย ฉันเริ่มที่จะไปบนท้องถนนด้วยประสบการณ์ก่อนหน้านี้และเทคโนโลยีใหม่ ๆ เช่น GraphQL
มีปัญหาไม่มากที่พบใน api , dashboard และ www แต่ miniprogram (小程序，下文简称mp) และ app ไม่โชคดีเพราะไม่ใช่ web 语言มาตรฐาน พวกเขาเป็นเหมือนการแสดง HTML 富文本ซึ่งสนับสนุน web ตามธรรมชาติ ในพวกเขาพวกเขากลายเป็น fuckingSelf และจำเป็นต้องแยกวิเคราะห์ด้วยตัวเองเช่น a เพราะไม่มี a ดังกล่าวใน mp และ app สิ่งที่เกิดขึ้นกับผู้ใช้คลิก a นั้นขึ้นอยู่กับนักพัฒนาซอฟต์แวร์ที่จะตัดสินใจซึ่งแตกต่างอย่างสิ้นเชิงจาก " web แอปพลิเคชัน" ที่ฉันพัฒนามาก่อน ถ้าฉันมีประสบการณ์ในการพัฒนา App มาก่อนฉันเชื่อว่าจะมีข้อผิดพลาดน้อยลง
เมื่อพูดถึงข้อผิดพลาดฉันคิดว่าทักษะการขุดหลุมของฉันน่าทึ่งจริงๆ RN เป็นที่นิยมเพราะมีหลุมมากมายและเชื่อว่าเป็นที่รู้จักกันดี โอเคฉันเลือกมัน คุณอาจไม่ทราบถึงข้อผิดพลาดของ monorepo แต่พวกเขาสามารถทำให้คนตายได้ โอเคฉันจะเลือก มีข้อผิดพลาดไม่มากในการพัฒนา RN กับ TS แต่ก็มีมากมาย โอเคฉันเลือกมันด้วย จากนั้นฉันก็เลือก RN + monorepo + TS Super Big Pit (ร้องไห้) แต่ฉันก็ยังคงนอนลงทีละน้อยทีละน้อยและฉันก็ชื่นชมความอดทนของฉัน (กระจายมือของฉัน)
ทำไมต้องเลือก monorepo เพื่อพัฒนา? ความตั้งใจดั้งเดิมของฉันคือการแบ่งปัน interface ของ TS และการกำหนดค่าที่นำกลับมาใช้ใหม่ได้ใน 5 ด้าน แต่ต่อมาเมื่อฉันเขียน mp และ app ฉันพบว่าเนื่องจากกลไกพิเศษบางอย่างของพวกเขาฉันไม่สามารถแบ่งปันได้ ในความเป็นจริง mp และ app แยกได้อย่างสมบูรณ์จาก monorepo หากฉัน refactor รหัสในภายหลังฉันจะใส่ "非标准web 应用" เหล่านี้แยกกันใน repo เพราะพวกเขายากที่จะให้บริการ node_modules ยังมีหนึ่งที่ไม่สามารถแชร์ได้และแต่ละอันมีขนาดใหญ่มาก มันไม่ใช่กุญแจสำคัญกุญแจสำคัญคือทุกครั้งที่ yarn install มันเต็มมากและซีพียูก็สูงขึ้นว่าคอมพิวเตอร์กำลังจะถอด ในขั้นต้นฉันมักจะใช้ yarn workspaces เพื่อแก้ปัญหา mono โดยไม่มี lerna แต่เนื่องจากปัญหานี้ฉันจึงพยายามที่จะไปที่ lerna แต่ปัญหาดูเหมือนจะไม่ดีขึ้นดังนั้นฉันจึงต้องยอมแพ้ ครั้งนี้ฉันให้ประสบการณ์กับ monorepo ซึ่งถือได้ว่าเป็นความเจ็บปวดจากเนื้อหนังและมันก็แจ้งให้ฉันทราบว่าจะเลือก mono และ multi ได้อย่างไร
ตกลงถ้าฉันถูกขอให้เขียนการจัดอันดับ 5 ด้านตอนนี้ฉันคิดว่ามันจะเป็นเหมือน mp > app นี้> www > api > dashboard
เหตุใด mp จึงถูกระบุว่าเป็นส่วนที่ยากที่สุด? เพราะ mp ไม่เพียง แต่มีสินค้าส่วนตัวจำนวนมากเท่านั้น แต่ยังมีเดฟทูลส์ยังมีข้อบกพร่องมากมาย บางครั้งฉันซ่อมแซมข้อผิดพลาด แต่มันไม่ได้ผลดีเป็นเวลานาน แต่ก็เพียงพอแล้วที่จะรีสตาร์ท Devtools สิ่งนี้ทำให้ฉันอาเจียนเลือดจริงๆ และเนื่องจากฉันใช้ Taro คุณสมบัติใหม่ ๆ มากมายเช่น custom-tab-bar ไม่ได้ติดตามมันและไม่มีเอกสาร ฉันคิดออกด้วยตัวเอง แต่ใช้เวลานานมาก แน่นอนถ้าคุณใช้ Taro และมีข้อกำหนดที่ custom-tab-bar leaa อาจเป็นทางออกที่ดีที่สุดสำหรับโซลูชัน GitHub ที่มีอยู่ในปัจจุบัน
นอกจากนี้ฉันมีหลายสิ่งที่จะพูดเกี่ยวกับ www ( Next.js v9) แต่เมื่อเวลาผ่านไปสิ่งเหล่านี้จะค่อยๆพูดหายไป "ไม่ต้องการพูด" แบบนี้ไม่ใช่แบบ "ไม่ยากสำหรับผู้ที่ไม่ยาก" แต่เพราะ Next.js มีข้อผิดพลาดมากเกินไปการแก้หลุมหนึ่งหลุมจะนำไปสู่ข้อผิดพลาดอื่น ๆ อีกมากมาย นอกจากนี้ยังไม่มีแนวทางปฏิบัติที่ดีที่สุดที่คุณจะอ้างถึง พวกเขาทั้งหมดเป็น example ง่ายๆ เมื่อคุณต้องการทำฟังก์ชั่นที่ซับซ้อน "SSR" ประเภทนี้ที่ต้องดำเนินการโดยทั้งด้านหน้าและด้านหลังทำให้ผู้คนรู้สึกเหมือน "ซ่อนไม่ได้" เมื่อมีการเปลี่ยนแปลงทุกครั้งในรุ่น Next.js เช่น 8to9 จะมีการเปลี่ยนแปลงเหมือนหน้าผามากมาย ไม่มีทางวัฒนธรรมของ Zeit เป็นเช่นนี้และคุณสามารถปลอบโยนตัวเองด้วย "ความทุกข์ทั้งหมดมาจากการไม่แข็งแรงพอ"
สำหรับ monorepo มีไฟล์จำนวนมากที่มี "ชื่อไฟล์ที่คล้ายกัน" ในโครงการ หลายครั้งที่ฉันรู้สึกว่าฉันถูกครอบงำด้วยไฟล์และสามารถแทรกแซงได้อย่างง่ายดายเมื่อมองหาไฟล์ แม้ว่าฉันจะยอมแพ้โดยใช้ Components/Filter/index.tsx เพื่อตั้งชื่อไฟล์ด้วย Components/Filter/Filter.tsx เพื่อค้นหา cmd + p สามารถค้นหาไฟล์ได้อย่างรวดเร็วแทนที่จะเป็นไดเรกทอรี แต่มันก็ยากที่จะกำจัดความรู้สึก "File Hell" นี้
เดิมทีบอกว่าฉันไม่ควรบ่นถ้าฉันสามารถเขียนบทสรุปได้ แต่ตอนนี้ดูเหมือนว่ายังมีข้อร้องเรียนอยู่บ้าง ทุกที่ตั้งแต่ Docker ถึง Api ถึง UI/UX กระบวนการเขียน leaa ได้สอนฉันมากมายและฉันมีความเข้าใจที่ลึกซึ้งยิ่งขึ้นเกี่ยวกับสถาปัตยกรรมซอฟต์แวร์และหลักการเปิดและปิด ในอดีตฉันคิดว่า "การเข้ารหัส" และ "สถาปัตยกรรม" กำลังทำสิ่งเดียวกัน แต่คราวนี้ฉันมีความเข้าใจที่ลึกซึ้งยิ่งขึ้น
ในปัจจุบันมีข้อบกพร่องมากมาย leaa แต่สิ่งนี้ดูเหมือนจะไม่ป้องกันผู้คนที่ต้องการการดึงรหัสที่เป็นประโยชน์สำหรับพวกเขาใน leaa ผ่าน GitHub นี่เป็นความตั้งใจดั้งเดิมของฉันในการเขียน leaa ด้านบน 2019-09-17 17:01 @ guangxi hezhou
จาก Git Commit เราจะเห็นได้ว่าบันทึกการพัฒนานี้ (บันทึกการพัฒนา) ตอนนี้เขียนไว้เท่านั้น โครงการเดิมเรียกว่า 1d1h ซึ่งหมายถึงหนึ่งชั่วโมงต่อวัน ฉันต้องการรวบรวมประสบการณ์ก่อนหน้านี้ในการเขียนด้านหน้าและด้านหลังในเวลาว่างและทำโครงการโอเพ่นซอร์สของบล็อก -> CMS -> SOHP รวมถึง API / Dashboard / เว็บไซต์ / WeChat WEAPP / Native Native (iOS / Android) เนื่องจากมันเป็น monorepo คล้ายกับอินเทอร์เฟซ / รายการสิ่งเหล่านี้ถูกแบ่งปันดังนั้นจึงรู้สึกว่ามันเป็นสิ่งที่สะดวกมากในการสร้างแพลตฟอร์มเต็มรูปแบบ
ในความเป็นจริงตอนแรกฉันต้องการเขียนบันทึกการพัฒนานี้ก่อนหน้านี้ แต่ในช่วงแรก ๆ ฉันใช้เวลามากมายในการแก้ไขปัญหาและฉันไม่สามารถหาเวลาเขียนบันทึกได้ ตอนนี้ฉันคิดเกี่ยวกับมันมันไม่ควรเป็นแบบนี้จริงๆ ท้ายที่สุดถ้าฉันบันทึกปัญหามากมายมาก่อนมันเป็นความมั่งคั่งที่มองไม่เห็น แม้ว่าฉันจะพบกันอีกครั้งฉันจะรู้วิธีแก้ปัญหาพวกเขาอย่างแน่นอน แต่ฉันไม่สามารถแบ่งปันให้คนอื่นได้ แต่ฉันจะตรวจสอบบันทึกต่อไปนี้อย่างช้าๆ
ให้ฉันพูดถึงความเข้าใจของฉันเกี่ยวกับแดชบอร์ดที่นี่ ฉันคิดว่าควรมีแดชบอร์ดขั้นต่ำที่มีอยู่
โมดูลเหล่านี้สามารถใช้เป็นบล็อกหลังจากเขียนโดยเฉพาะอย่างยิ่งการอนุญาตบทบาท หากมีข้อกำหนดทางธุรกิจมันเป็นเรื่องง่ายมากที่จะพัฒนาขึ้นอยู่กับการลดขนาดของแดชบอร์ด ฉันได้ประมวลผลสิทธิ์ในโครงการก่อนหน้าหลายครั้ง แต่คราวนี้มันเป็น GraphQL ซึ่งแตกต่างจากการพักผ่อนก่อนหน้าเล็กน้อยดังนั้นฉันยังคงใช้เวลาในการโยน
ฉันได้เขียนโค้ดมากมายกับ Nest.js แต่ก็ไม่สะดวกที่จะพิจารณา เหตุผลในการเลือกคือฉันได้รับความสนใจจากกระบวนทัศน์ทั้งหมดของเขาและการสนับสนุนการพิมพ์ที่ติดอาวุธให้กับฟัน ผู้แต่ง @kamilmysliwiec ยังคงทรงพลังมาก การใช้บรรจุภัณฑ์บางอย่างของ Nest.js นั้นยอดเยี่ยมมาก สิ่งที่สำคัญที่สุดคือการรวมกับเทคโนโลยีที่หลากหลายและได้ดำเนินการสถานการณ์ทางธุรกิจมากมาย นี่เป็นสิ่งที่ยอดเยี่ยมจริงๆ
React + Antd เป็นตัวเลือกเทคโนโลยีทั่วไปบน dashboard อย่างไรก็ตามในครั้งนี้เนื่องจากมีการเปิด hooks อย่างเต็มที่รวมถึง Apollo รุ่นเบต้าล่าสุดและคลาสแทบจะเป็นไปไม่ได้ที่จะเห็นในโครงการทั้งหมด อย่างไรก็ตามหลังจากใช้ hooks ในขนาดใหญ่โค้ดจะดูน่าเกลียดจริงๆ หากความชัดเจนของรหัสคลาสได้คะแนน 10 คะแนนในอดีต Hooks สามารถทำคะแนนได้เพียง 5 คะแนน แน่นอนสิ่งที่ชัดเจนที่สุดคือการได้รับการแบ่งปันรหัส FN ถ้าเป็นชั้นเรียนมันจะค่อนข้างลำบากในการแบ่งปันคลาส FN
ไม่มีทางเลือกสำหรับส่วน www มันสามารถเป็น next.js เท่านั้น ในความเป็นจริงฉันได้พัฒนาชุด React-SSR ที่ค่อนข้างสมบูรณ์ แต่เพื่อปรับให้เข้ากับคลื่นและ @Guillermo God กำลังผลักมันขึ้นมาและเป่ามันทุกวันฉันอดไม่ได้ที่จะซื้อต่อไป เมื่อฉันเริ่มเขียน www ฉันเกิดขึ้นกับการเปิดตัวของ Next.js v9 ซึ่งเป็นเวอร์ชันใหม่ของเรือที่ได้รับการเขียนใหม่ใน TS ตั้งแต่ Core ฉันคิดว่ามันจะราบรื่นมาก แต่ฉันไม่ได้คาดหวังว่ามันจะเป็นเคล็ดลับ ...
ท้ายที่สุดแล้ว ANTD จะต้องมีการรวมเข้าด้วยกันซึ่งหมายความว่ารหัสหน้าของลูกค้าเองจำเป็นต้องใช้ CSSMODULE น้อยกว่า ANTD ไม่ได้ใช้งานและเซิร์ฟเวอร์จะโยนมันเมื่อคุณเห็นน้อยลง ดังนั้นปลั๊กอินที่ไม่มีที่ติอย่างเป็นทางการสามารถจัดการได้มากถึง 60% เท่านั้นและการสนับสนุนที่เหลืออีก 40% นั้นไม่เพียงพอ เดิมเช่น next.js และ cra มันเป็นเหมือนการห่อ webpack ฉันไม่ต้องการให้คุณสัมผัสกับมะเร็งส่วนหน้าและมันเป็นความยุ่งยากของไก่ผัด
อย่างไรก็ตามฉันอยากจะบอกว่าเฟรมเวิร์กจะให้ความสะดวกสบายแก่คุณหลายครั้งในช่วงแรกของโครงการดังนั้นมันจะทำให้คุณมีปัญหาหลายครั้งในระยะต่อมาของโครงการ สิ่งนี้เป็นจริงสำหรับ CRA, Expo และ Next.js ไม่มีข้อยกเว้นทั้งคู่เป็นกล่องดำ จากนั้นฉันต้องเขียน 100% withplugin ในสองชั่วโมงมิฉะนั้นโครงการจะติดอยู่ ฉันมองผ่าน GitHub และต้องการดูว่ามีวิธีแก้ปัญหาหรือไม่ แต่น่าเสียดายที่ฉันไม่พบรหัสที่เกี่ยวข้องหลังจาก V9 ดูเหมือนว่าฉันสามารถร่วมเพศได้เท่านั้น แม้ว่าฉันจะคุ้นเคยกับ webpack มาก แต่ next.js ได้เพิ่มกล่องสีดำบาง ๆ ลงใน Webpack แต่การเขียน Withplugin มีรูปแบบที่จมอยู่ใต้น้ำในบริบทที่ไม่รู้จัก มันเป็นการเคลื่อนไหวที่น่าผิดหวังมาก แต่โชคดีที่ในที่สุดมันก็ทำในครึ่งชั่วโมง ฉันพูดถึงปัญหาด้วยการแก้ปัญหาของตัวเองและปิดอย่างรวดเร็วเมื่อไม่ได้ค้นพบ ฉันหวังว่าจะช่วยคนที่พบปัญหาเดียวกันเมื่อค้นหาปัญหา ท้ายที่สุดยังมีอีกหลายคนที่ต้องการ next.js + antd ไร้เดียงสาโดยเฉพาะในประเทศจีน
เวลาบินเร็วมากและครึ่งเดือนผ่านไปในพริบตา ฉันไม่ได้เขียนอะไรใหม่ ๆ ให้กับ Leaa เมื่อเร็ว ๆ นี้ โฟกัสอยู่ที่การบูรณาการของ Alibaba Cloud OSS ต้องการใช้ฟังก์ชั่นดังกล่าว:
กระบวนการค่อนข้างยากซึ่งเกี่ยวข้องกับการโต้ตอบระหว่างท้องถิ่นและ OSS ยิ่งกว่านั้นเนื่องจาก OSS โดยตรงคำขอทั้งหมดจะไม่ผ่าน API และกลายเป็นโทรกลับที่รอ OSS มีความจำเป็นเพื่อให้แน่ใจว่า DB ไม่สามารถเคลื่อนย้ายได้โดยไม่ต้องทำตามขั้นตอนใด ๆ ในความเป็นจริงหากการอัปโหลดผ่าน API แล้ว API จะถูกประมวลผลอย่างสม่ำเสมอแล้วนำไปใช้กับ OSS มันจะง่ายและใหญ่มาก ฉันกังวลเป็นหลักว่าเมื่อทำกิจกรรมบางอย่างหากเกี่ยวข้องกับการอัปโหลดไฟล์การเกิดพร้อมกันจะมีขนาดใหญ่มากและเซิร์ฟเวอร์จะไม่สามารถกู้คืนได้ ดังนั้นจึงจำเป็นต้องบล็อก OSS ก่อน
โดยทั่วไป www, API และแดชบอร์ดสิ้นสุดลง เริ่ม miniprogram ในวันพรุ่งนี้
เมื่อฉันแยกพัสดุเป็นครั้งแรกฉันพบว่า React ได้รับการอัพเกรดเป็น 16.9.0 ฉันปลอบประโลม Warning: componentWillMount... ฉันดูที่ React Changelog และพบว่ามันเป็นการเปลี่ยนแปลงที่สำคัญ lifecycle สองสามตัวจะถูกยกเลิกในเวอร์ชันอนาคต เนื่องจาก Leaa-Dashboard ขึ้นอยู่กับ antd จึงเป็นการดีกว่าที่จะรอการเปิด antd เพื่อกำจัดคำเตือนเหล่านี้ก่อนการอัพเกรด ปัจจุบัน React ถูกล็อคใน "react": "16.8.6", "react-dom": "16.8.6"
ฉันทำแบนเนอร์ leaa stack และวางไว้ที่ด้านบนของ readme เทคนิคที่ใช้อธิบายรูปภาพดีกว่าข้อความมาก ยังพูดถึงชื่อ Leaa นี่คือชื่อของนักแสดงหญิงชาวฝรั่งเศสLéa Seydoux ที่ฉันชอบ เพื่อหลีกเลี่ยงอัตราการทำซ้ำที่สูงฉันได้เพิ่มพิเศษด้านหลัง Lea อย่างไรก็ตามประเด็นที่พบบ่อยที่สุด LEAA ใน Google คือ Law Enforcement Assistance Administration เป็นหน่วยตุลาการของสหรัฐอเมริกา (หัวเราะ)
ฉันเพิ่งใช้ผ้าสำลีเพื่อค้นหาข้อผิดพลาดหลายอย่างในโครงการ สิ่งที่น่าสนใจคือ packages/leaa-dashboard/src/pages/Permission/PermissionList/PermissionList.tsx L159 ที่นี่ printWidth ของโครงการ .prettierrc และ max-len ของ .eslintrc.js ถูกตั้งค่าเป็น 120
ฉันต้องเพิ่ม eslint-disable-next-line max-len รู้สึกเป็นไปได้มากที่หนึ่งในนั้นใช้ > และอีกอันคือ >= อย่างไรก็ตามหลังจากที่ฉันแก้ไขคุณสมบัติของทั้งคู่ฉันพบว่านี่ไม่ใช่ปัญหา ลืมมันเพิ่ม Max-Len ก่อน ในปัจจุบันมีเพียงสถานที่เดียวเท่านั้น หากมีตัวอย่างไม่เพียงพอฉันจะไม่จัดการกับมัน ฉันจะจัดการกับปัญหานี้ในอนาคต
แม้ว่าฉันจะให้ความสนใจกับรหัสสไตล์ แต่ฉันจะใช้ IDE เพื่อเขียน Marco ด้วย Keymap และใช้กฎ prettier และ eslint ในการจัดรูปแบบ แต่หลังจากที่โครงการสาธารณะอาจมีผู้มีส่วนร่วมเข้ามา (ไม่ไม่มี HHHH) และฉันคิดว่ามันจะดีกว่าที่จะเสียบรูปแบบรหัสใน git commit
โดยปกติแล้ว husky ก็เพียงพอสำหรับโครงการ แต่มีไฟล์โมโนเรปจำนวนมาก ทุกครั้งที่ git commit เกจทั้งหมดไฟล์ทั้งหมดจะเป็น eslint จะติดอยู่อย่างหลีกเลี่ยงไม่ได้ดังนั้นจึงจำเป็นต้องร่วมมือกับ lint-staged เพื่อลดการประมวลผล ESLINT และปล่อยให้ไฟล์ใน GIT Stage Run Eslint ในครั้งนี้
อย่างไรก็ตามดูเหมือนว่าเจ้าหน้าที่ไม่ได้ให้คำแนะนำและตัวอย่างมากเกินไปสำหรับ monorepo หลังจากสำรวจมันฉันพบว่ามันไม่ได้ลำบาก แต่มันก็ไม่เหมือนกับที่ไม่ใช่ Monorepo เพื่อที่จะแยกตัวออกจาก pacakge.json ฉันยังเขียนลงในไฟล์กำหนดค่าเช่นนี้:
module . exports = {
'packages/**/*.ts?(x)' : [ 'prettier --write' , 'eslint' , 'git add' ] ,
'packages/**/*.(css|less)' : [ 'prettier --write' , 'stylelint' , 'git add' ] ,
} ;ฉันลองแล้วมันก็ค่อนข้างเร็ว อาจต้องใช้เวลาสักครู่ในการรู้ถึงผลกระทบหากคุณมีแนวทางปฏิบัติที่ดีที่สุด
ฉันลอง Taro ประมาณหนึ่งคืนและมันก็ไม่เหมาะอย่างยิ่ง ทำไม ก่อนอื่นสิ่งที่ฉันต้องการคือ React ต่อเฟรมเวิร์ก小程序และสิ่งที่ฉันต้องการคือแอปเพล็ต ONLY เพราะเหตุใดฉันจะอธิบายรายละเอียดในภายหลัง
หลังจากการใช้งานครั้งแรก Taro รู้สึกเหมือนเขาเป็นอาจารย์ เขามีความรับผิดชอบอย่างหนักและจำเป็นต้องเข้ากันได้กับสภาพแวดล้อม类小程序มากเกินไปเช่น支付宝小程序,今日头条小程序ฯลฯ .... และยังต้องพิจารณาเข้ากันได้กับเครื่องยนต์ CSS yoga ของ RN ทีมยังคงยากมาก ฉันยังคงชื่นชมมันมาก ฉันต้องยกนิ้วให้ที่นี่ ต่อไปฉันจะพูดถึงความรู้สึกทั่วไปของฉันหลังจากผ่านไปสองสามชั่วโมง
สมบูรณ์แบบ! เช่นเดียวกับการพัฒนาเว็บปกติไม่มีอะไรจะพูด รองรับ HRM และรองรับโมดูล CSS อย่าสนใจเกี่ยวกับ webpack คุณสามารถเรียกใช้ได้เพียงแค่ขึ้นมา อย่างไรก็ตามสิ่งหนึ่งที่น่าสังเกตคือถ้าคุณต้องการเข้ากันได้กับ RN คุณไม่สามารถใช้ taro-ui หรือ UI ui ของบุคคลที่สามอื่น ๆ คุณสามารถใช้ @tarojs/component ในตัวเท่านั้น ข้อ จำกัด นี้ดูเหมือนจะค่อนข้างติดอยู่ ฉันหวังว่า taro-ui จะสนับสนุน RN โดยเร็วที่สุด
นอกจากนี้ยังสมบูรณ์แบบมากและไม่มีสิ่งเลวร้าย หลังจากวิ่งแล้วให้เปิดเครื่องมือตรวจแก้จุดบกพร่อง WeChat อย่างเป็นทางการและลงไปที่ถนนได้อย่างราบรื่น ข้อผิดพลาดเพียงอย่างเดียวคือมันไม่เป็นมิตรกับการสนับสนุน monorepo แน่นอนว่าสิ่งนี้เป็นที่เข้าใจได้ มีเพียงไม่กี่คนที่ใช้ monorepo ในประเทศจีน หากคุณใช้มันคุณจะต้องปรับแต่งมันเป็นทัศนคติของ "คุณมีความสามารถในการแก้ปัญหาใด ๆ เกี่ยวกับ monorepo " ฉันวิ่งภายใต้ monorepo และฉันพบปัญหานี้:
can't find module : ../../../node_modules/@tarojs/taro-weapp/
นอกจากนี้ยังมีบางคนในชุมชนที่กำลังพูดถึงปัญหาเช่นการสนับสนุน monorepo วิธีการของฉันคล้ายกับของเขา พวกเขาใช้ nohoist ของเส้นด้าย Wokesspaces เพื่อทำมัน อย่างไรก็ตามวิธีแก้ปัญหาของฉันคือการรักษาโมดูลที่เกี่ยวข้องกับ Taro ภายใต้แพคเกจย่อยเท่านั้น สำหรับสิ่งอื่น ๆ จะเป็นการดีกว่าที่จะปรับปรุงและเพิ่มโมดูลการแบ่งปันให้สูงสุด:
{
"nohoist" : [ " **/@tarojs/** " ]
} ฉันวิ่งมันหลังจากเห็น dev:rn ใน package.json ผลที่ได้ก็ดี ฉันเห็นพรอมต์ว่าการรวบรวมประสบความสำเร็จ แต่ไม่มีการติดตาม ... จากนั้นฉันไปที่เอกสารอย่างเป็นทางการและพบว่ามันซับซ้อนเล็กน้อย แล้วอะไรคือความแตกต่างระหว่างสิ่งนี้กับการพยายามทำชุดการพัฒนา RN ดั้งเดิมเพียงอย่างเดียว? และถ้าคุณพึ่งพา Taro เวอร์ชัน RN จะถูกล็อคที่ 0.55.4 ความดีของฉัน! นี่อยู่ไกลจากจำนวนเวอร์ชันอย่างเป็นทางการที่ 0.60.x คุณควรรู้ว่าการทำซ้ำทุกรุ่นของ RN เป็นการก้าวกระโดดเชิงคุณภาพ หากคุณใช้ 0.60.x คุณสามารถรับ Hermes บน Android และประสิทธิภาพจะได้รับการปรับปรุงอย่างมาก อีกสิ่งหนึ่งที่ทำให้ฉันกังวลคือการใช้ RN@Taro หมายความว่าคุณสามารถใช้ UI lib @tarojs/component เท่านั้นซึ่งหมายความว่าคุณต้องยอมแพ้ NativeBase และ Shoutem ซึ่งเป็น RN ที่มีคุณภาพสูง
อืม ... เพื่อสรุปหากคุณไม่ได้คิดเกี่ยวกับการประหยัดค่าใช้จ่ายและเวลาและต้องการ一套代码多处运行ขอแนะนำให้เลิก RN@Taro หากคุณต้องการพูดคุยเกี่ยวกับเวลาที่ดีที่สุดฉันคิดว่าอย่างน้อยก็คือ taro-ui ที่รองรับ RN แน่นอนค่าใช้จ่ายนี้สูงเกินไปและเป็นไปได้มากที่เจ้าหน้าที่จะไม่ให้การสนับสนุน
โอเคกลับไปที่หัวข้อกันเถอะ ความตั้งใจดั้งเดิมของฉันในการใช้ Taro คือการใช้สำหรับโปรแกรมมินิในตอนแรกเท่านั้นดังนั้นฉันคิดว่า "ทุกอย่างโอเค" สำหรับสถานการณ์ปัจจุบัน leaa-app ยังคงเป็น RN หรือ expo หลังจากทั้งหมดเคล็ดลับนั้นทำโดยทั่วไปในโครงการที่ผ่านมา (หัวเราะ)
มันเศร้ามากที่ได้บันทึกประสบการณ์การใช้ Taro ในระหว่างวันวันนี้ ...
ก่อนอื่นสิ่งที่เจ็บปวดมากขึ้นคือ @apollo/react-hooks และ react-apollo ไม่ได้รับการสนับสนุน! กล่าวอีกนัยหนึ่งไม่สามารถใช้แพ็คเกจ Apollo อย่างเป็นทางการได้! คุณไม่สามารถ useQuery และไม่อนุญาตแม้แต่ <Query> หากคุณใช้มันคุณจะรายงานตะขอให้ Invariant Violation: Invalid hook call. ผลที่ได้คือคุณสามารถเขียน Export apolloClient apolloClient.query() โดยตรง นี่เป็นคืนก่อนการปลดปล่อย!
ตอนแรกฉันคิดว่ามันสะดวกและฉันมีความสุขมากที่ได้ทำงานในโหมด H5 โดยการดีบักและ apolloClient ฉันไม่ได้คาดหวังว่า ... โหมด小程序โผล่ขึ้นมาและบอกว่า fetch is not found globally and no fetcher passed, to fix pass.... ฉันตรวจสอบข้อมูลและบอกว่ามันเป็น "ในการอัพเกรดโปรแกรม WeChat Mini การดึงข้อมูลทั่วโลกถูกลบออก" มีเพียงไม่กี่บรรทัดของห้องสมุดทั้งหมด:
return new Promise(resolve =>
wx.request({
...
complete: ({ data, statusCode, errMsg }) => resolve({...})
}))
จากนั้นแทนที่ด้วย HttpLink และ fetch: wxApolloFetcher ฉันไม่เคยคาดหวังว่า WeChat จะทำการอัปเดตสไตล์หน้าผาซึ่งเป็นการดำเนินการที่สมเหตุสมผล
ถัดไปคือปัญหาของ alias เส้นทาง ปัญหาอย่างเป็นทางการโพสต์นี้ถูกกล่าวถึงอย่างเข้มข้นที่สุด ฉันลองหลังจากอ่าน แต่ก็ยังไม่มีทางออก วิธีแก้ปัญหาที่นี่คือวิธีแก้ปัญหาคือการแก้ปัญหาทางด้าน小程序ไม่ได้และด้าน H5 นั้นดี นี่ ... ฉันเป็น monorepo หลังจากทั้งหมดและมันจะกลายเป็นเรื่องน่าอายมากถ้าฉันไม่สามารถแชร์รหัสในแพ็คเกจ @leaa/common ได้ โอเคฉันจะไม่ใช้มันอีกต่อไปแบกมัน
ฉันคิดว่ามันเป็นการทรมานหลังจากประสบกับการพัฒนา RN แต่คราวนี้ ... โอ้อย่าพูดถึงมันอีกต่อไปฉันตำหนิเทคโนโลยีที่ฉันใช้นั้นใหม่เกินไป (ปัง)
- อ่านเพิ่มเติม ...
