[SCSS] scss로 코딩하기

1. 확장프로그램 설치하기

 

vs code 하단에 watch sass 버튼을 눌러서 Watching... 상태일때 scss를 작성하면 저장할때마다 css파일이 실시간으로 만들어진다! 

 

2. settings.json 

 

Flie - Preferences - Settings 에서 

Workspace - Live Sass Compiler - Edit in settings.json

 

Edit in settings.json을 누르면 

settings.json 이 생성되는데, 아래 코드를 넣어주면 된다..! 

파일 경로 잘 볼 것..... css 생성이 계속 안돼서 30분을 고민했는데 src을 빼먹었던것.......ㅎ...

scss 파일을 저장하면 css폴더에 css파일이 자동으로 생성된다! 

저장할때마다 실시간으로 잘 만들어진다ㅎㅎ

---

[ ERROR ] 

 

sass를 설치하려하니 이런 오류가 떴었는데

 

스크립트 실행 권한이 제한되어 있어 발생하는 문제라 권한을 변경시켜줘야 한다고 한다..!

windows powerShell 관리자 모드에 들어가서 변경해주면 된다.

 

get-ExecutonPolicy로 현재 권한 상태를 확인해보니 Restricted 상태라서 실행이 되지 않았던 것이라고

 

 

RemoteSigned 상태로 변경해주면 된다!

set-ExecutionPolicy RemoteSigned

 

잘 변경 되었는지 get-ExecutionPolicy 명령어로 확인하면 RemoteSigned 상태로 잘 변경된것을 확인할 수 있다.

 

이제 다시 프로젝트로 돌아가서 sass를 설치했더니 아주 잘 된다...!

 

 

 

 

 

vs code에서 scss로 작업하는법(scss→css컴파일)

 

[error] VSCode 오류(이 시스템에서 스크립트를 실행할 수 없으므로 ~ps1 파일을 로드할 수 없음)