inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

목데이터 불러오는 단계에서부터 막혔어요

해결됨

한 입 크기로 잘라먹는 Next.js

2.9> 한입북스 UI 구현하기 13분 강의하고 똑같이 따라해보고 안 되길래 깃헙에서 복붙에서 붙여 놔도 안되는데 이러면 다른 파일이 틀렸을 가능성이 있나요?

  • react
  • typescript
  • next.js
댓글 2 좋아요 0 조회수 200

연관관계 매핑과의 관련

미해결

자바 ORM 표준 JPA 프로그래밍 - 기본편

강사님께서 수업을 시작하면서 해당 장은 연관관계를 세팅하는 것과는 관련이 없다고 말씀을 해주셨습니다. 연관관게 매핑 시간에 배운 내용에 의하면 Parent 엔티티에 있는 childList 는 읽기 전용이 됩니다. 하지만 cascade 속성에 의해 읽기 전용이 무력화? 되는 듯한 느낌입니다. 그래서 정리를 해보자면 "연관관계 주인 반대쪽( mappedBy 를 쓰는 쪽)의 읽기 전용은 cascade 속성에 의해 소용이 없어질 수 있다." 라고 생각하면 될까요?

  • java
  • jpa
조태준 댓글 2 좋아요 0 조회수 145

재랜더링 최적화 문제

미해결

Next + React Query로 SNS 서비스 만들기

안녕하세요. 제가 직접 tailwind css v4를 이용해서 트위터 클론코딩을 진행하고 있는데 SearchForm에서 입력이 이루어지면, SearchForm의 영향으로 인해서 다른 영역에서도 재랜더링이 일어나는 것 같습니다. 먼저 묻고싶은 내용은 어떻게 하면 다른 영역은 재렌더링이 일어나지 않게 할까 입니다. 리엑트 개발자 도구로 렌더링이 일어날때 하이라이트 표시를 켰습니다. 이 때 SearchForm에 입력이 일어나면 위와같이 SearchForm만 아닌, 다른 영역에도 렌더링이 되는 모습이 보입니다. SearchForm 구성은 다음과 같이했습니다. 최대한 현재 트위터의 입력 방식을 맞추어 보았습니다. "use client"; import { useSearchParams } from "next/navigation"; import React, { useRef, useState, ChangeEventHandler, useEffect, memo, } from "react"; interface SearchFormProps { q?: string; } const SearchForm = () => { const [value, setValue] = useState(""); const inputRef = useRef<HTMLInputElement>(null); const searchParams = useSearchParams(); const search = searchParams.get("q"); const handleChange: ChangeEventHandler<HTMLInputElement> = (e) => setValue(e.target.value); const handleClear = () => { setValue(""); inputRef.current?.focus(); }; useEffect(() => { setValue(search ?? ""); }, []); return ( <div className="relative w-inherit h-12 group min-w-0"> {/* Border 레이어 */} <div className={` absolute inset-0 border border-default-border rounded-full transition-all duration-75 group-focus-within:border-2 group-focus-within:border-twiiter-blue `} /> {/* 내부 요소 컨테이너 */} <div className="relative w-full h-full"> <form className="flex items-center w-full h-full px-4" autoComplete="off" onSubmit={(e) => e.preventDefault()} > {/* 검색 아이콘 (외부 div 기준 위치) */} <svg className="absolute left-4 top-1/2 -translate-y-1/2 text-gray-500 pointer-events-none" width={20} height={20} viewBox="0 0 24 24" aria-hidden="true" fill="none" stroke="currentColor" strokeWidth={2} > <circle cx="11" cy="11" r="8" /> <line x1="21" y1="21" x2="16.65" y2="16.65" /> </svg> {/* Input */} <input ref={inputRef} type="search" placeholder="검색" value={value} onChange={handleChange} className=" w-full h-full pl-10 pr-10 bg-transparent text-base outline-none placeholder-gray-500 appearance-none " /> {/* Clear 버튼 (외부 div 기준 위치) */} {value && ( <button type="button" onClick={handleClear} className=" absolute right-3 top-1/2 -translate-y-1/2 w-7 h-7 flex items-center justify-center bg-gray-700 hover:bg-gray-800 rounded-full transition " tabIndex={-1} aria-label="Clear" > <svg width={16} height={16} viewBox="0 0 20 20" fill="white"> <path d="M10 8.586l4.95-4.95 1.414 1.414L11.414 10l4.95 4.95-1.414 1.414L10 11.414l-4.95 4.95-1.414-1.414L8.586 10l-4.95-4.95L5.05 3.636 10 8.586z" /> </svg> </button> )} </form> </div> </div> ); }; export default SearchForm; 이를 SearchHeader에 적용하였으며. import React from "react"; import SearchTab from "./SearchTab"; import SearchForm from "@/components/common/SearchForm"; const SearchHeader = () => { return ( <div className="w-[calc(100%-72px)] sm:pl-0 sm:max-w-[598px] fixed backdrop-blur-lg border-b-1 border-default-border bg-white/70 dark:bg-black/30"> <div className="w-full mt-2"> <SearchForm /> </div> <div className="w-full mt-1 h-[53px]"> <SearchTab /> </div> </div> ); }; export default SearchHeader; 최종적으로 /search 페이지에 이를 적용했습니다. import React from "react"; import Post from "../home/_components/Post"; import SearchHeader from "./_components/SearchHeader"; interface SearchPageProps { searchParams: Promise<{ q: string; f?: string; pf?: string }>; } const SearchPage = async ({ searchParams }: SearchPageProps) => { const { q } = await searchParams; return ( <main className="main-container"> <SearchHeader /> <div className="mt-[107px]"> <Post /> <Post /> <Post /> <Post /> <Post /> <Post /> <Post /> <Post /> <Post /> </div> </main> ); }; export default SearchPage; 관련된 layout.tsx는 다음과 같습니다. import Image from "next/image"; import Link from "next/link"; import React, { ReactNode } from "react"; import logo from "@/../public/twitter-logo.svg"; import SearchForm from "@/components/common/SearchForm"; import NavMenu from "./_components/NavMenu"; import LinkButton from "@/components/common/LinkButton"; import FollowCard from "./_components/FollowCard"; import TrendCard from "./_components/TrendCard"; import RightSection from "./_components/RightSection"; interface AfterLoginLayoutProps { children: ReactNode; modal: ReactNode; } const AfterLoginLayout = ({ children, modal }: AfterLoginLayoutProps) => { return ( <div className="overflow-y-scroll"> <div className="flex items-stretch"> <header className="flex items-end flex-col sm:flex-grow-1"> <section className="w-[72px] p-2 xl:p-0 xl:w-[275px] h-dvh"> <div className="flex flex-col w-inherit h-dvh fixed "> <Link href={"/home"}> <div className="w-14 h-14 rounded-[50%] flex justify-center items-center hover:bg-[rgba(15,20,25,0.1)]"> <Image src={logo} alt={"twitter logo"} width={40} height={40} /> </div> </Link> <NavMenu /> </div> </section> </header> <div className="flex items-start flex-col h-dvh flex-grow-1"> <div className="h-full w-[100%] sm:w-[600px] lg:w-[920px] xl:w-[990px] flex justify-between "> <main className="w-full sm:max-w-[600px] min-h-full h-fit border-l-1 border-r-1 border-default-border"> {children} </main> <div className="hidden lg:block lg:w-[290px] xl:w-[350px] h-fit relative"> <div className="flex flex-col w-inherit h-dvh fixed pt-1"> <RightSection /> </div> </div> </div> </div> </div> {modal} </div> ); }; export default AfterLoginLayout; SearchForm에 React.memo를 적용을 해보아도 변하지 않았습니다. (다른 영역, 예를 들어 main이 아닌 양 옆의 영역들에 대해서도 React.memo를 넣었지만 그래도 렌더링이 일어나고 있습니다.) 재랜더링 조건은 부모 컴포넌트가 재랜더링 되거나, props가 바뀌거나, state 변경이 일어났을 때인걸로 알고 있습니다. searchForm에서 Input만 영역에만 영향을 줘야할 것이 분명한데, 전체 영역에서 재랜더링이, 즉 layout.tsx에서 재랜더링이 일으키고 있는것 같습니다. (부모 영역) 혹시 렌더링이 어디까지 일어나는지 확인하는 (즉 최종 부모 컴포넌트까지) 방법이 있나요? 그리고 이런 문제가 있을때 어떻게 최적화 할 수 있나요? p.s. 코드상 w-inherit 클래스가 이면 제가 직접 tailwind css utility에 추가하여 기능하도록 만들었습니다. + 추가 console.log()로 재랜더링이 일어나는지 확인해 보았는데 콘솔이 뜨지 않아 재랜더링이 아닌 다른 무슨 활성화(?) 인것 같아 보입니다... 하지만 SearchForm 입력 가지고 무언가 활성화 되는 것 자체가 조금 이해가 되지 않아서... 일단 재랜더링이라고 표현으로 남겨두었습니다...

  • react
  • next.js
  • react-query
  • next-auth
  • msw
피곤한개발자 댓글 2 좋아요 0 조회수 167

DLQ 재시도 로직 처리후 DLQ에 unacked 1건이 남는거에 대해서

미해결

RabbitMQ를 이용한 비동기 아키텍처 한방에 해결하기

안녕하세요. 예시 학습 중에 DeadLetterQueue 수동 재시도 관련해서 질문있습니다. http 호출 이후에 추가적으로 DLQConsumer가 호출되지는 않는데, 처리 후 RabbitMQ 콘솔 확인해보니 DLQ에 unacked 한 건 이 남아 있었습니다. 제 생각에는 DLQConsumer에서 정상적으로 메시지 소비했으면 마찬가지로 ack 처리 해줘야 하는게 아닌가 싶은데, DLQ에 unacked 상태로 남기는게 의도된 경우가 있을수 있는건지 궁금합니다. order_completed_queue에서는 모두 처리되서 메시지가 보이지 않습니다. 예시 코드 @Component @RequiredArgsConstructor public class OrderDLQConsumer { private final RabbitTemplate rabbitTemplate; @RabbitListener(queues = RabbitMQConfig.DLQ) public void process(String message) { System.out.println("DLQ Message Received: " + message); try { String fixMessage = "success"; rabbitTemplate.convertAndSend( RabbitMQConfig.ORDER_EXCHANGE, "order.completed.shipping", fixMessage ); System.out.println("DLQ Message Sent: " + fixMessage); } catch (Exception e) { System.err.println("### [DLQ Consumer Error] " + e.getMessage()); } } }

  • java
  • spring-boot
  • jpa
  • msa
  • websocket
  • rabbitmq
이진우 댓글 2 좋아요 0 조회수 184

해당 내용에 대한 내용 요약

미해결

고성능 JPA & Hibernate (High-Performance Java Persistence)

Hibernate Connection Lifecycle 수업은 해당 내용을 이해가 안되서 몇번 봤지만 결론적으로 디폴트 설정은 save할때 마다 오토커밋 때문에 성능저하가 발생한다. 그러므로 해당 설정 hibernate.connection.provider_disables_autocommit=true 을 통해서 오토커밋을 방지하면 성능이 향상되는걸로 이해 하였고, 일관성 있는 트렉젝션 처리로 @transactional로 관리 한다,, 라고 이해 하였습니다 맞을까요,,? 혹시 해당 내용이 아니면 댓글 부탁드립니다. 덕분에 공부는 많이 되네요,,!

  • java
  • jpa
  • hibernate
오개발 댓글 1 좋아요 0 조회수 269

추상 클래스의 접근 제어자 관련 질문

미해결

김영한의 실전 자바 - 기본편

안녕하세요. 복습을 하면서 질문이 있어서 남겨드립니다. 지금 강의중에서 접근 제어자를 전부 public으로 하셨는데 순수 추상 클래스는 상속 용도로만 사용이 가능한데 public이 아닌 protected로 두는게 더 명확하지 않을까요?

  • java
  • 객체지향
양성빈(Robert) 댓글 1 좋아요 0 조회수 98

강의에서 말씀하신게 어느 강의에 있는지 궁금합니다

미해결

김영한의 실전 자바 - 고급 1편, 멀티스레드와 동시성

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문 전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? 예 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? 예 [질문 내용] 스레드 풀 로그 관련 얘기하셨는데 스프링 강의에서 엑츄에이터.그라파나 얘기를 한적 있다고 하는데 어느 강의에서 어느 부분인가요?

  • java
  • 객체지향
  • 동시성
  • multithread
  • thread
yoonho 댓글 1 좋아요 0 조회수 105

Context 분리하기 중에서 memoizedDispatch에 useMemo를 사용하는 이유가 궁금합니다.

해결됨

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

안녕하세요. 리액트 초보입니다. 이해하기 쉽게 설명해주셔서 감사합니다. 11.3) Context 분리하기 강의 약 7분 쯤에서 궁금한 부분이 있어서 질문 남깁니다. <TodoDispatchContext.Provider> 를 통해 context를 전달할 때, 함수를 캐싱하기 위해 강의에서는 아래와 같이 useMemo를 사용해주셨는데요! const memoizedDispatch = useMemo(() => { return { onCreate, onUpdate, onDelete }; }, []); 우선 최적화하고자 한 이유는 아래와 같다고 이해했습니다. onCreate, onUpdate, onDelete 모두 한 번 생성한 후에 바뀌지 않는 함수로, TodoDispatchContext를 참조하는 자식 컴포넌트들의 리렌더링 방지 그리고 useMemo를 사용하신 부분에서는 마운트 후 onCreate, onUpdate, onDelete는 변하지 않는 함수 이므로 "값을 캐싱한다"는 의미에서 useMemo를 사용해주셨다고 이해했습니다. 다만 useCallback도 mount 후 deps 변경 전에는 함수의 중복 생성을 방지한다는 점에서는 useCallback을 사용해도 좋을 것 같단 생각이 들었는데요, 결론적으로 제가 궁금한 부분은 아래와 같습니다. useMemo 대신 useCallback을 사용해서도 동일하게 최적화 할 수 있다고 이해했는데, 제가 이해한 게 맞을까요? 1번이 맞다면 강의에서 useMemo를 사용해주신 이유는 캐싱하기 위함(의도)을 표현하기 위함이라고 이해하면 될지도 궁금합니다! 실무에서는 useMemo와 useCallback을 모두 사용할 수 있는 경우 어떤 훅을 선택하시는지, 강의에서 useMemo를 통해 캐싱하신 이유가 궁금했습니다 ! 블로그를 찾아봐도 잘 이해가 되지 않아서 질문으로 남깁니다! 답변 주시면 감사하겠습니다!

  • javascript
  • react
  • node.js
slothbear.hj 댓글 2 좋아요 0 조회수 231

Set.copyOf 컴파일 에러 문의드립니다

해결됨

자바(Java) 알고리즘 문제풀이 입문: 코딩테스트 대비

import java.util.*; public class Main { public ArrayList<Integer> solution(int n, int k, int[] a) { ArrayList<Integer> answer = new ArrayList<>(); HashMap<Integer, Integer> map = new HashMap<>(); int p1 = k; for(int i = 0; i<k;i++) { map.put(a[i],map.getOrDefault(a[i], 0) + 1); } answer.add(map.size()); while (p1 < n) { map.put(a[p1],map.getOrDefault(a[p1], 0) + 1); map.put(a[p1 - k], map.get(a[p1 - k]) - 1); for(int x : Set.copyOf(map.keySet())) { //값이 0인 key 제거 if (map.get(x) == 0) { map.remove(x); } } answer.add(map.size()); p1++; } return answer; } public static void main(String[] args) { Main T = new Main(); Scanner sc = new Scanner(System.in); int n = sc.nextInt(); int k = sc.nextInt(); int[] arr = new int[n]; for (int i=0; i<n;i++) { arr[i] = sc.nextInt(); } for (int x : T.solution(n, k, arr)) { System.out.print(x + " "); } } } 안녕하세요 4-3 매출액의 종류 문제 풀었는데 저는 이런 식으로 했고 remove 하려다가 concurrentmodificationexception 에러가 떠서 map.keySet() 을 복제로 만들기 위해 Set.copyOf를 했는데 이클립스에서는 문제없이 돌아가지만 코딩 채점에서는 컴파일 에러가 뜨더군요. 이거 왜 이러는 걸까요?

  • java
  • 코딩-테스트
망나뇽 댓글 2 좋아요 0 조회수 108

6분23초 MainPage 코드와 자료 코드 불일치 관련 문

해결됨

코드로 배우는 React 19 with 스프링부트 API서버

안녕하세요, 강사님. React Router 설정 강의 중 6분 23초에 사용하신 MainPage 코드와 강의 자료에 제공된 MainPage 코드의 작성 방식이 서로 달라서 문의드립니다. 영상에서는 함수 선언식( function MainPage … )을, 자료에서는 화살표 함수( const MainPage = … ) 형태로 소개되어 다소 혼란이 있습니다. 혹시 두 방식 중 특별히 권장하시는 것이 있는지 , 아니면 단순히 문법 스타일 차이인지 알고 싶습니다 . 또한, React나 Spring Boot의 버전 차이 에 따라 코드 작성 방식이 달라지는 부분이 있는지도 궁금합니다. 앞으로는 강의 영상 기준의 코드 를 우선 따라 작성해도 괜찮을지 안내해 주시면 감사하겠습니다. 바쁘신 와중에 읽어주셔서 감사합니다. 답변 기다리겠습니다. 감사합니다.

  • spring-boot
  • jpa
  • jwt
  • redux-toolkit
  • react
김지수 댓글 2 좋아요 0 조회수 147

AWS 배포 후 사이트 접속이 원할하지 않은 문제

해결됨

(2025) MBTI 테스트 기반 수익형 웹사이트 만들기 - <코딩 배워 사업하자>

선생님! 안녕하세요! 제가 AWS에 배포 후 도메인을 붙이고 접속했을 때 첫 페이지는 잘 나왔습니다. 근데 테스트를 클릭하니 URL이 도메인 주소가 아닌 localhost로 바뀌면서 접속이 안됩니다. 어느 포인트를 수정해야할까요?ㅠ

  • react
  • aws
  • Google-Analytics
  • cloudflare
  • adsense
  • 수익화
asd 댓글 1 좋아요 0 조회수 141

삭제기능 구현부분에 대해 질문있습니다.

미해결

React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지

안녕하세요 삭제기능 구현 강의를 보다가 조금 어려운 부분이 있어 질문을 드립니다. canvas.js 파일에서 getCanvases함수와 createCanvas함수는 canvases.get, canvases.post앞에 return이 붙었고 이건 다른 곳에서 사용할 수 있다라고 알고 있습니다. 그럼 deleteCanvas는 왜 똑같이 return을 사용하지 않고 async await을 사용했는지 궁금하고 왜 위에 두 함수는 return을 사용했는지도 궁금합니다.

  • react
  • React-Context
  • react-router
  • tailwindcss
  • react-query
부드러운 족제비 댓글 2 좋아요 0 조회수 84

도표 강의 자료 열람 불가능

미해결

따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]

안녕하세요 강의 잘 듣고 있습니다 도표강의자료 들어가면 파일을 찾지 못했다고 오류가 나옵니다

  • react
  • redux
  • node.js
  • 웹앱
  • mongodb
sheepjune 댓글 1 좋아요 0 조회수 138

VS코드에러

해결됨

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

VS코드에서 에러는 뜨는데 실행은 됩니다. 강의VS코드에서는 에러 안뜨던데 왜 제꺼에서만 에러가 뜰까요?

  • javascript
  • react
  • node.js
H Hun 댓글 1 좋아요 0 조회수 118

<> </> 의미

해결됨

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

여기서 에러떠서 리턴문 안에<> </> 추가했더니 해결됬어요 <> </> 의미가 뭐죠?

  • javascript
  • react
H Hun 댓글 3 좋아요 0 조회수 118

왜 클래스 이름에 Facade 가 붙나요?

해결됨

재고시스템으로 알아보는 동시성이슈 해결방법

안녕하세요 좋은 강의 감사드립니다! service -> ropository 를 참조하니 Facade 인데 왜 NamedLockStockFacade , OptimisticLockStockFacade 에 클래스 이름에만 Facade 를 붙이나요?? 현업에서는 어떤 상황에 Facade 를 붙여서 사용하나요?

  • java
  • spring
  • 동시성
바나나 댓글 2 좋아요 0 조회수 198

설정이 헷갈립니다.

해결됨

스프링부트로 직접 만들면서 배우는 대규모 시스템 설계 - 게시판

영상에서 가정하는게 앱이 여러개이고 DB가 1개인 경우가 맞나요? 만약 앱이 2개이고 DB가 2개인 경우는 어떻게 작동하나요??

  • java
  • mysql
  • spring-boot
  • kafka
  • redis
이동연 댓글 1 좋아요 0 조회수 194

멀티 코어에서의 CAS

미해결

김영한의 실전 자바 - 고급 1편, 멀티스레드와 동시성

안녕하세요 강사님 🙂 너무너무 잘 듣고 있습니다. 좀 바보같은 질문일 수도 있는데, CPU 가 하드웨어적으로 다른 스레드의 접근을 막고 한 연산 안에서 "값 확인, 값 변경" 을 진행한다고 이해했습니다. 혹시 멀티코어에서 더라도 별다른 문제가 발생하진 않나요? 가령 두 하드웨어가 연산을 따로따로 하며 서로를 인식하고 있지 않으니까, 동시에 "한 연산"을 수행해서, "값 확인 및 변경" 역시 정확히 동시에 진행된다면 충돌이 나지 않을까? 싶은 생각이 들었습니다. 제가 잘 못찾은건지 질문이 말도 안되는건진 모르겠지만 찾아봐도 잘 나오질 않아서, 질문을 드려보게 되었습니다 ㅠ

  • java
  • 객체지향
  • 동시성
  • multithread
  • thread
강우석 댓글 1 좋아요 0 조회수 110

tailwind css 오류

미해결

코드로 배우는 React 19 with 스프링부트 API서버

postcss.config.js는 설정할 필요 없나요?

  • react
  • spring-boot
  • jpa
  • jwt
  • redux-toolkit
이상영 댓글 2 좋아요 0 조회수 119

tailwind css 오류

미해결

코드로 배우는 React 19 with 스프링부트 API서버

'tailwind'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다. 떠서 수동으로 tailwind.config.js 파일 추가하고 index.css랑 기타 설정하고 실행했더니 ERROR in ./src/App.css (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!./node_modules/source-map-loader/dist/cjs.js!./src/App.css) Module build failed (from ./node_modules/postcss-loader/dist/cjs.js): Error: It looks like you're trying to use tailwindcss directly as a PostCSS plugin. The PostCSS plugin has moved to a separate package, so to continue using Tailwind CSS with PostCSS you'll need to install @tailwindcss/postcss and update your PostCSS configuration. at Le (C:\react\react_springboot\node_modules\tailwindcss\dist\lib.js:36:1984) at LazyResult.runOnRoot (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:361:16) at LazyResult.runAsync (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:290:26) at LazyResult.async (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:192:30) at LazyResult.then (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:436:17) ERROR in ./src/index.css (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!./node_modules/source-map-loader/dist/cjs.js!./src/index.css) Module build failed (from ./node_modules/postcss-loader/dist/cjs.js): Error: It looks like you're trying to use tailwindcss directly as a PostCSS plugin. The PostCSS plugin has moved to a separate package, so to continue using Tailwind CSS with PostCSS you'll need to install @tailwindcss/postcss and update your PostCSS configuration. at Le (C:\react\react_springboot\node_modules\tailwindcss\dist\lib.js:36:1984) at LazyResult.runOnRoot (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:361:16) at LazyResult.runAsync (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:290:26) at LazyResult.async (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:192:30) at LazyResult.then (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:436:17) 위 오류가 뜨네요 ㅜ

  • react
  • spring-boot
  • jpa
  • jwt
  • redux-toolkit
이상영 댓글 1 좋아요 0 조회수 622

인기 태그

인프런 TOP Writers

주간 인기글