vite으로 리액트 빌드하기를 업데이트해주세요.
미해결
한 입 크기로 잘라먹는 타입스크립트(TypeScript)
CRA 으로 리액트를 빌드하는 것은 레거시이기 때문에, vite으로 리액트를 빌드하는 식으로 강의를 업데이트하는 것이 필요해보입니다. 감사합니다.
- typescript
- react.js
- vite
173만명의 커뮤니티!! 함께 토론해봐요.
미해결
한 입 크기로 잘라먹는 타입스크립트(TypeScript)
CRA 으로 리액트를 빌드하는 것은 레거시이기 때문에, vite으로 리액트를 빌드하는 식으로 강의를 업데이트하는 것이 필요해보입니다. 감사합니다.
미해결
따라하며 배우는 도커와 CI환경 [2023.11 업데이트]
vite를 사용하여 리액트를 생성하는 경우는 CRA를 통한 리액트 생성하는 방법과 다른것 같습니다. vite.config.js에서 옵션 추가하고 실행하면 정상적으로 동작합니다! import { defineConfig } from "vite"; import react from "@vitejs/plugin-react"; // https://vite.dev/config/ export default defineConfig({ plugins: [react()], server: { host: true, // start 옵션 추가 watch: { usePolling: true, }, // end 옵션 추가 }, });
해결됨
프론트엔드 빌드 시스템 완벽 가이드 - Part.1: 모듈 시스템
안녕하세요, 강의 잘 듣고 있습니다! 최근 개인 프로젝트로 래핑 라이브러리를 만들고 있고 번들러로 Rolldown을 사용하고 있습니다. 강의에서 언급된 Rollup과 구조가 유사하고 기본 개념은 거의 동일하다고 알고 있습니다. Rolldown을 사용하고 있는 상황에서 Webpack이나 Rollup의 구조를 먼저 이해하는 것이 학습에 도움이 될까요? 학습 우선순위나 접근 방식을 어떻게 잡는게 좋을지 궁금합니다.
해결됨
프론트엔드 빌드 시스템 완벽 가이드 - Part.1: 모듈 시스템
안녕하세요. 좋은 강의 감사합니다. 캐싱 관련해서 이해가 잘 안 되는 부분이 있어 질문드립니다. 강의에서는 modules[moduleId][0].call 의 첫 번째 인자로 module.exports 를 넘겨주는 것이 캐싱과 관련 있다고 설명해주셨는데요. 제가 코드를 보기엔 module.exports 가 thisArg 로 전달되긴 하지만, 실질적인 캐싱은 함수 내부에서 세 번째 인자인 module 객체를 직접 수정하면서 ( module.exports = { add }; ) 이뤄지는 것으로 보입니다. 즉, thisArg 로 전달된 module.exports 는 실제로 의미 있는 쓰임새가 없고, 캐싱은 module.exports 를 직접 설정함으로써 발생하는 것 아닌가 싶은데, 혹시 제가 잘못 이해한 걸까요?
해결됨
프로젝트로 쉽게 배우는 TypeScript 기초
이런식으로 퀴즈에 답변이 뭔지 나와있어서 말씀드립니다!
미해결
Vue3 완벽 마스터: 기초부터 실전까지 - "실전편"
안녕하세요. 선생님 강의에서 .env 와 .env.development로 환경 변수가 모드에 따라서 구분 되는 것을 보았습니다. 제가 VITE_BASE_PATH 환경 변수를 설정하고 vite.config.ts 파일에서 vite 설정의 base 옵션에 사용했을 시에도 development 모드와 production 모드가 정상적으로 동작이 될까요? const env = load(mode, process.cwd()) return { base: env.VITE_BASE_PATH, }
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
안녕하세요. 현재 업데이트 된 강의를 보면서 프로젝트를 만들고 있습니다. 그런데 중간에 typescript를 사용하기로 해서 잘라먹는 타입스크립트도 같이 결제 해서 들을려고 합니다. 하지만 타입스크립트 강의는 vite를 사용하지 않는거 같아서 타스를 적용하기 전에 질문드립니다. vite로 프로젝트 만들고 있는 중간에 타입스크립트를 사용할수 있게 변경할 수 있나요? vite를 안쓰고 잘라먹는 리액트 강의를 들으면 따라가기 불가능 할까요? 혹시 타스 강의도 업데이트 할 예정이 있으신가요?
미해결
Vue.js + TypeScript 완벽 가이드
안녕하세요. 캡틴판교님이 vue-news를 포함하여 대부분 Vue2로 강의를 하셔서 저는 Vue3로 리팩토링 해봤습니다. 최근 Vue3로 작업(Composition API 쓰는 맛이 😇 )을 많이 하시는 것 같고, 이미 저는 Tistory 블로그를 Vue3로 커스텀하여 운영하고 있기도 하고, 이번에 Typescript 강좌를 다 보면서 힘들어도 굳이 Vue3로 작업해보고 싶었거든요. 혹시나 저처럼 해보고 싶은 분들이 계실 것 같아 작업한 내용이 아래 링크에 있으니 참조하시면 편하실 것 같습니다. 🫡 이전에 작업했던 vue-news는 제가 따로 GitHub에 올려놨기 때문에 그 소스를 기반으로 작업하였습니다. 아래와 같이 꽤 변경한 부분이 있으나 어느 정도 숙달된 분들은 가이드 문서 보시고 따라오시면 금방하실 거라 생각되며, 참고로 저는 Composition API로 작성하는 게 맘에 들어서 이를 적극적으로 적용하였습니다. Use Vue3, Setup Composition API, Typescript Vue-CLI -> Vite Vuex -> Pinia Add scroll event to /news URL CSS & Header https://github.com/haguri-peng/vue-news-typescript
미해결
풀스택 리액트 라이브코딩 - 간단한 쇼핑몰 만들기
제목처럼 react typescript vite설치를 하려고 터미널에 yarn create vite를 입력하여 설치를 했습니다. 아래 이미지와 같이 typescript를 선택 후, 설치를 완료했는데... 아래 이미지들처럼 설치 하자마자 빨간줄들이 난무하고있습니다ㅜㅜ 아래 이미지는 package.json 파일입니다. 어떻게 해결할 수 있을까요?
미해결
안녕하세요 한참 검색하다 해결을 못해서 질문합니다. 현재 vite를 통해 react를 돌리고 있는데 redux-toolkit으로 상태관리를 하고 있습니다. 그러던 중 비동기 store를 만들기 위해 createAsyncThunk를 사용했는데 컴퍼넌트내에서 호출 시 Actions must be plain objects. Use custom middleware for async actions. 다음과 같은 오류가 발생했습니다. 그래서 console에 값을 찍어보니 type과 action 대신 creatorAction이라는 함수가 결과 값으로 나왔습니다. 호출 시에 '변수명()'를 붙여주었는데도 다음과 같은 결과를 받았는데 해결 방안이 있는지 궁금합니다. (추가로 create-react-app으로 설치한 다른 폴더에서는 잘 작동됩니다.)