velopert / react-tutorial

벨로퍼트와 함께하는 모던 리액트 튜토리얼 문서

https://react.vlpt.us/

350 stars 101 forks source link

1. Sass · GitBook #25

Open utterances-bot opened 4 years ago

utterances-bot commented 4 years ago

1. Sass · GitBook

https://react.vlpt.us/styling/01-sass.html

Mrzero-00 commented 4 years ago

sass적용 이후의 yarn start로 브라우저 열리면 무한 로딩상태가 되는데 이문제는 어떻게 해결해야하나요??ㅠㅠ

jaeseok-kim-web commented 4 years ago

터미널에 yarn node-sass 를 입력하니 yarn : 'yarn' 용어가 cmdlet, 함수, 스크립트 파일 또는 실행할 수 있는 프로그램 이름으로 인식되지 않습니다. 이름이 정확한지 확인하고 경로가 포함된 경우 경로가 올바 른지 검증한 다음 다시 시도하십시오. 라고 뜨는 데 어떻게 해야하나요?

minhyup commented 4 years ago

리액트와 SASS를 조합한 강점을 볼 수 있었네요~ 잘봤습니다.

jscyworld commented 4 years ago

최근에 Node Sass version 5.0.0 is incompatible with ^4.0.0. 에 대한 이슈가 있는거 같은데 어떻게 해야하나요..?

jaeson-dev commented 4 years ago

@jscyworld 최신 5.0.0 버전을 삭제 하시고 하위 버전으로 재설치 하시면 됩니다. npm uninstall node-sass npm install node-sass@4.14.1

bbkyoo commented 3 years ago

처음에 Node Sass version 5.0.0 is incompatible with ^4.0.0. 이 에러가 떠서 npm uninstall node-sass,
npm install node-sass@4.14.1 을 했는데 그 다음에는 ./src/App.scss (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-6-1!./node_modules/postcss-loader/src??postcss!./node_modules/resolve-url-loader??ref--5-oneOf-6-3!./node_modules/sass-loader/dist/cjs.js??ref--5-oneOf-6-4!./src/App.scss) Error: Node Sass does not yet support your current environment: Windows 64-bit with Unsupported runtime (88) For more information on which environments are supported please see: https://github.com/sass/node-sass/releases/tag/v4.14.1 에러가 계속 뜨는데 어떻게 헤결해야 하나요?

hayoung-jeremy commented 3 years ago

github 에는 justify-content: center , align-items: center 가 있는데 게시글에서는 안보입니다!

dev-rojieun commented 3 years ago

저 궁금한게 있는뎅.. App.js 에서 Button 컴포넌트에서

// 이렇게 넣으면 large 사이즈의 gray 버튼이 생성이되는데

// 이렇게하면 아래와 같이 기본값으로 medium 이 될 줄 알앗는데, 아니더라구요,

// 이런 경우는 기본값을 설정할 수 있는 부분이 따로 있을까요?

// 위와 같은 경우는 size class 자체가 없는 것이기 때문에 // <button className="button gray ..." 로만 되는것이므로 // 기본 값으 주려면 button 클래스에 줘야할까요?

dodok8 commented 3 years ago

node-sass가 depecrated 되었으므로 dart-sass 설치로 바꾸는 것이 좋을 것 같습니다.

minwoohi commented 3 years ago

node-sass 대신 sass를 설치하면 될 것 같습니다.

yarn remove node-sass
yarn add sass

yechukim commented 2 years ago

위에 코드로만 보고 따라하시는 분들 버튼이 가운데 정렬이 안되고 위에 치우쳐있을 때, display:inline-flex 를 해당 코드에서 빼주시거나 , 아니면 display: inline-flex; justify-content: center; align-items: center; 이렇게 추가해주시면 되요!

jaehyukkk commented 1 year ago

감사합니다 정말 많은 도움 됐습니다.

universooa commented 1 year ago

감사합니당!!

osh6006 commented 1 year ago

감사합니다 SASS가 햇갈릴 때 강의 한번 더 보고 오겠습니다!