typescript - Webpack עבור Storybook: מודול לא נמצא עבור קבצי ts עם סיומות .web, .ios או .android
אני מנסה להשתמש ב-Storybook, עם expo ו-react-native-web. בכל פעם שאני מנסה להשתמש במודול של expo אני מקבל את השגיאה הבאה
ERROR in ./node_modules/expo-linear-gradient/build/LinearGradient.js Module not found: Error: Can't resolve './NativeLinearGradient' in '/Fleyver/front/node_modules/expo-linear-gradient/build' @ ./node_modules/expo-linear-gradient/build/LinearGradient.js 1:1373-1406הקובץ שהוא אינו יכול לפתור מכיל מספר סיומות עבור .web.ts, .ios.ts ו-.android.t
קרא עוד →reactjs - Storybook + React Native + Typescript בעיית webpack/loader
כאשר מנסים להריץ פרויקט storybook + RN + Typescript לאחר שעוקבו גם
ו
אני מקבל:
ModuleParseError: Module parse failed: Unexpected token (10:12) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders| ייבוא {dontSetMe} מ'./utils/shims'; | ייבוא DraggableCore מ'./DraggableCore';
import type {ControlPosition, PositionOffsetCont
קרא עוד →reactjs - טעינת חמה ב-Storybook גורמת לשגיאת hooks
אני מקבל את השגיאה הבאה כאשר Storybook שלי נטען מחדש באופן חם. זה עובד בצורה מושלמת בטעינה הראשונה:
TypeError: Cannot read property 'hooks' of undefined at StoryStore.cleanHooks (http://localhost:9009/vendors~main.0e777466815571a0333e.bundle.js:6197:22) at renderMain (http://localhost:9009/vendors~main.0e777466815 קרא עוד →reactjs - מתקן שינוי התיבה של React Storybook לא עובד
אני יוצר קומפוננטת צ'קבוקס באמצעות React, Typescript, Storybook ו-Styled-Components, אחרי שעקבתי אחרי המדריך הזה: building-a-checkbox-component-with-react-and-styled-components. נאלצתי להתאים את הקוד כי אני משתמש ב-FunctionComponent, אבל אני נתקל בבעיה עם מנהל השינויים (change handler). אני לא יכול לסמן או להס
קרא עוד →reactjs - storybook עם typescript לא מתייחס לקובץ tsx כקובץ typescript - 'שגיאת ניתוח: חסר נקודה-פסיק'
אני פשוט לא מבין למה זה קרה, ניסיתי לתקן את זה במשך כמה שבועות ורק חזרתי ל־javascript בסיפורים שלי.
הנה הענף שמכפיל את הבאג. זהו הפרויקט המלא. בתוך ./examples תראה אפליקציית דמו שרצה עם react-react-app עם TypeScript ו-Storybook. בפנים תראה src/stories/Xarrow.stories.tsx שכאשר מריצים yarn storybook זורק Parsing error: Missing semicolon. בדיוק כמו שניסיתי לשים TypeScript בתוך קובץ JavaScript.
קרא עוד →reactjs - Docker MonoRepo עם Storybook 'לא ניתן למצוא מודול react/package.json'
אני די חדש בדוקר, והיום ניסיתי לדוקריז את המונורפו שלנו של lerna באמצעות ההגדרות הבאות:
דוקרפייל
FROM node:14.13.1-alpine Add node modules bin to path ENV PATH /app/node_modules/.bin:$PATH ENV PATH /app/packages/core/node_modules/.bin:$PATH WORKDIR /app Install app deps COPY ./ ./ RUN yarn install RUN yarn bootstrap RUN cd packages/core && yarn install && cd ./node_modules/react && yarn link && cd ../../../../ && yarn link react קרא עוד →javascript - שימוש ב-tsx ו-mdx ב-Storybook React
אני מנסה להשיג את זה:
אבל עם הסיפורים שלי מחולקים לקבצי mdx ו-tsx.
עד כה הקובץ שלי ב-mdx נראה כך:
import { Meta, Story, Canvas, Preview, Props, ArgsTable } from '@storybook/addon-docs'; import { Button, Icons } from '../..'; <!-- Components --> export const ButtonWithoutIcon = (args) => <Button {.. קרא עוד →javascript - איך לכתוב ספר סיפורים לילד שהורה מנהל את המצב
אני כותב ספר סיפורים לרכיב ילד שבו ההורה ינהל את הסטייט. לדוגמה, ה-value(מחרוזת) וה-onChange(פונקציה) מועברים דרך props. יש לי את שני ה-props מועברים, אבל אני לא בטוח איך לעדכן את הסטייט בקובץ הסיפור.
textfield.tsx
import React, { FC, HTMLProps } from 'react'; type FirstNameTextFieldProps = HTMLProps<HTMLInputElement> const FirstNameTextField: FC<FirstNameTextFieldProps> = ({ ...restOfProps }) => ( <input type=& קרא עוד →reactjs - Storybook: איך לתעד טיפוסי ארגומנטים/פרופס כלליים
קונטקסט וקוד
הרחבנו את הכפתור שלנו כך:
export type ButtonProps<P = Record<string, unknown>> = P & { children: ReactNode | string onClick?: () => void className?: string disabled?: boolean secondary?: boolean } const Button = <P extends Record& קרא עוד →reactjs - קבצי הסיפורים של Storybook שנכתבו ב-TypeScript אינם מטופלים כראוי
לאחרונה העברתי את פרויקט ה-CRA שלי ל-Next.js השתמשתי ב-Storybook בפרויקט הזה, ולכן נאלצתי לערוך הרבה הגדרות, אך עדיין נותרו בעיות קשורות ל-TypeScript.
זו דוגמה לקובץ הסיפור שלי.
import { ComponentStory, ComponentMeta } from '@storybook/react'; import Index from 'pages/profile'; export default { title: 'Views/Profile', component: Index, } as ComponentMeta<typeof Index>; export const IndexTemplate: ComponentStory<typeof Index> = (args) => <Index {... קרא עוד →