React/Npm3 [React] npm 배포 시 문제 cra 환경에서 패키지를 만들어서 npm에 배포를 하다가 문제가 발생했다. 해결하기 위해서 이곳 저곳 찾아봤는데, babel 문제로 파악되었다. { "presets": ["@babel/preset-env", "@babel/preset-react"] } 해당 내용을 package.json에 넣어주니 배포가 되었다. 배포한 패키지를 다운받아서 테스트를 해보니 이번에는 React is not defined가 나왔다. 다시 한번 찾아보니 preset-react에 추가적인 옵션을 줘야 했다. presets: [ "@babel/preset-env", ["@babel/preset-react", {"runtime": "automatic"}] ] runtime 옵션을 주니 이번엔 배포가 되고 다운 받아도 문제 없이 실행.. 2023. 3. 26. [NPM] React SNS Login 패키지 만들기 0. 들어가면서 웹사이트 개발을 하다가 한 번쯤은 만나게 되는 기능이 SNS 로그인이 아닐까 생각한다. SNS 로그인이 참 직접 만들기엔 귀찮고, npm에서 받아서 쓰자니 하나씩은 패키지가 있지만 여러 가지 SNS 로그인이 가능한 패키지는 내가 찾기엔 없었다... (키워드를 몰라서 그럴수도? ) 그래서 내가 한번 만들어보려고 한다! 1. 이름 정하기 내가 SNS 로그인 모음 패키지를 찾기 위해서 몇 가지 키워드로 검색을 했는데, 그중 react-sns-login 이라는 패키지가 있을 법한데 없었다. 그래서 내가 겟또 했다. 패키 지명 : react-sns-login 2. 만들 SNS 로그인 종류 정하기 SNS 종류는 정말 많다. 카카오, 네이버, 구글.... 등 기본적으로 카카오, 네이버, 구글은 우리나.. 2022. 3. 30. [NPM] react-slick 0. 들어가면서 웹사이트를 만들다 보면 필연적으로 만나는 기능 중 하나인 Slide! 요즘은 워낙 고수분들이 가공하여 배포를 해줘서 npm에서 검색을 하면 웬만한 기능은 사용이 가능하다. 그런데 react-slick이라는 좋은 Slide가 사용에 대해서 조금 불편한 점이 있어 그 부분 정리하는 김에 같이 정리하였다. 물론 내가 Document를 못 찾는 걸 수 있다.... 1. 공통 react-slick은 기본적으로 태그 안에서 슬라이드 별 필요한 옵션을 넣어 사용한다. 또 본문에 SlideContainer, SlidePage 같은 태그가 있을 건데, 그건 styled-component를 사용해서 기본적인 디자인을 넣었다. 추가로 기본적으로 제공하는 css 스타일을 적용하기 위해서 두 가지 css 파일을.. 2022. 3. 14. 이전 1 다음 반응형
