inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

실무에 바로 적용하는 스토리북과 UI 테스트

TextField의 IconButton 컴포넌트와 .svg 관리방법

svg를 public 말고 src>assets안에 넣는다면 import를 어떻게해야하나요?

해결된 질문

265

yho79555

작성한 질문수 9

1

현재는 public에서 아이콘을 가져오는데 assets에 가져올때는 어떻게 하나요?

 

 

import type { Meta, StoryObj } from "@storybook/react";
import { IconButton } from "../../components/IconButton";
const meta = {
  title: "Buttons/IconButton",
  component: IconButton,
  parameters: {
    layout: "centered",
  },
  tags: ["autodocs"],
  argTypes: {
    alt: { control: "text", description: "아이콘의 대체 텍스트" },
    iconPath: {
      control: "text",
      description: "아이콘의 경로",
      defaultValue: "",
    },
    onClick: { action: "clicked", description: "아이콘 클릭 시 호출되는 함수" },
  },
} satisfies Meta<typeof IconButton>;

export default meta;
type Story = StoryObj<typeof meta>;

export const Default: Story = {
  args: {
    alt: "아이콘",
    iconPath: "ic-delete-dark.svg",
    onClick: () => {},
  },
};

 

react typescript tailwind-css storybook ui-testing

답변 2

1

yho79555

강의에 있었네요

0

제이쓴

확인 감사합니다!

스토리북에 대해서

0

57

1

Storybook 10에서 argTypes에 action 설정 시

0

74

1

storybook setup

0

86

2

실무 적용 관련해서 질문이 있습니다!

0

62

2

storybook 프로젝트 세팅 중 궁금한 점이 있습니다.

0

130

2

스토리북 테스트에 대한 질문

0

101

2

tailwind 4.x 버전 변경된 CSS 추출(?) 커맨드

1

207

2

스토리북 테마에 대해 질문 드립니다.

0

156

2

테일윈드를 안쓰고 스타일 컴포넌트만 사용하는 환경에서는요?

0

144

2

[질문 x 공유용] tailwind v4.0 으로 강의랑 다를 때 (import 다름, tailwind.config.js 없어짐 등)

6

483

2

react-toastify 를 storybook에 출력 시키기

0

180

1

react에서 modal & portal 사용시 에는 어떻게 작성해야될까요

0

374

3

tsconfig

0

179

1

vite 초기설정

0

343

2

스토리 내 args에서 에러가 발생합니다.

0

208

2

Nextjs에서 tailwind를 사용할 때

0

278

2

제공해주시는 Figma 색상 코드가 강의와 달라 글 남깁니다!

0

141

2

Visual Test

1

127

1

NavigationBar 배경색

0

129

1

defaultValue 질문 드립니다!

0

123

1

index.tsx 빌드 오류

0

371

2

tailwind css 코드 스플릿팅이 가능한가요?

0

279

1

StoryBook 관련 궁금 사항입니다.

1

259

1

type-error 해결 방법 질문

2

406

4