reactjs - בעיות ניגוד בעת קומפילציה של קוד ב-Rollup/Typescript/React

קיבלתי עבודה באוגוסט, והכי חשוב שבעקבות המגפה הזו, אני בעצם שמרתי עליה גם!!

כפרויקט צדדי רציתי ללמוד ליצור ספריית רכיבי React לשימוש עצמי שלי (הרבה רחוק מלהיות מלאה) עם Rollup בשביל tree-shaking שלה + תוספים עבור cjs, udm וכו' עבור תאימות.

כאשר אני מקמפל עם TSC זה כמעט מושלם עכשיו כששיניתי כמה דברים לגבי הארגון ו-TSConfig בנייה נפרדת.

TSConfig שלי

ה-Build TSConfig שלי

הקונפיגורציה שלי ל-Rollup

אני לא בטוח אם יש בעיות בולטות שמישהו יכול לראות במבט ראשון או לא, שיניתי קצת כאן ושם כדי לנסות לקבל את rollup לעבוד מלכתחילה, אבל זה ברור שלא נפתר נכון אחרת לא הייתי כאן! :D

הערת צד: למרות שהגדרתי custom.d.ts בשורש להכריז על ייבוא SVG עם svgr, TypeScript עדיין לא מבין את ההכרזה ומציג שגיאת סוג:

declare module '*.svg' {
import React = require('react')
export const ReactComponent: React.FC<React.SVGProps<SVGSVGElement>>
const src: string
export default src
}

אני אומר ש-TSC Config כמעט מושלם, אבל יש כמה דברים שאני מודע להם:

1. אני לא בטוח שקומפילציה של TSC טובה ל-Tree-shaking. תקנו אותי אם אני טועה כאן, אבל זו הסיבה ש-Rollup קיים, נכון?
2. נראה ש-TSC לא משנה את קיצורי הנתיבים שלי בתוך הקונפיגורציה, שם יש לי '@app' עבור 'src' כדי להתגבר על הפתרון של '../../../../'.

כשאני מנסה להשתמש ב-Rollup אני נתקל בשני בעיות שונות לחלוטין:

1. למרות שהסוגים נמצאים בתיקיה ./src/types/*.ts, אין לי קובץ הצהרה ברמת השורש בתוך תיקיית ה-'dist' שלי, הם מפוזרים בתיקיות הרכיבים האישיים עבור ה-props שלהם.
2. לא כל הפרופס והסוגים שמשמשים בוודאות ברכיבים מייצאים וכו' מיוצאים, ישנם מספר רכיבים שהפרופס שלהם הם (_a: any) וזה כמובן חוויה מאוד גרועה לעבוד איתם.
3. אני לא בטוח אם זה גם פותר/ממיר את כינויים של הנתיב שלי, אז זו משהו שאני צריך לבדוק פעמיים.

אם מישהו יכול לעזור בבעיה הזו אני אהיה אסיר תודה לנצח! כבר חיפשתי בגוגל/רדיט/SO מישהו עם בעיות דומות לשלי ולא נתקלתי בפתרונות שעבדו בהצלחה.