code

많은 sass 파일을 포함하는 전체 디렉토리 / 폴더의 변경 사항을 보는 방법

codestyles 2020. 11. 14. 10:13
반응형

많은 sass 파일을 포함하는 전체 디렉토리 / 폴더의 변경 사항을 보는 방법


많은 sass 파일을 포함하는 전체 디렉토리의 변경 사항을 어떻게 추적 할 수 있습니까? 다음 명령을 사용하여 sass의 변경 사항을 확인합니다.

파일:

sass --watch style.scss:style.css

그러나 많은 sass 파일을 포함하는 전체 디렉토리 / 폴더의 변경 사항을 보는 방법.


다음 sass --watch <input folder>:<output folder>과 같이 명령을 사용하십시오 .

$ ls -l
css/ sass/
$ sass --watch sass:css

어디 <input folder>말대꾸 파일과 포함 <output folder>하는 호스트 생성 된 CSS 파일을.


piouPiouM의 답변을 조금 확장 :

  • 로 끝나는 것을 제외하고 입력 파일과 동일한 이름으로 출력 파일이 생성됩니다 .css.
  • <input folder><output folder>동일 할 수있다.
  • 두 폴더 모두 현재 작업 디렉토리가 될 수 있으므로 다음이 유효합니다.

    $ sass --watch .:.


Grunt 또는 Sass-watch를 사용하지 않고이 작업을 완료했습니다.

npm install -g watch
watch "sass assets/app.scss assets/dist/app.css" assets/css

터미널로 이동하여 폴더로 이동 한 다음 다음과 같이 썼습니다.

 sass --watch .

이것은 모든 sass 파일을 감시하고 동일한 이름의 css 파일로 변환합니다. 또한 다음과 같이 할 수 있습니다.

sass --watch ~/user/youUser/workspace/project/styles/

도움이 되었기를 바랍니다.


현재 폴더에 있으면 다음을 수행하여 시청하십시오.

F:\sass tutorial>sass --watch ./:./

나머지 파일을 포함하는 하나의 sass 파일을 만든 다음이 파일을 볼 수 있습니다.

또는 Grunt 와 아주 좋은 grunt-contrib-compass 플러그인을 살펴보십시오.


정보에 따르면 다음 명령 줄을 사용할 수 있습니다.

sass --watch .

출처 : http://sassbreak.com/watch-your-sass/#what-does---watch-do


누군가 2018 년에이 문제에 직면 한 경우 :
sass 웹 사이트는 더 이상 사용되지 않는 Ruby Sass참조합니다 . 현재 (2018 년 5 월) npm을 통해 dart sass를 설치하면 명령을 지원하지 않습니다.--watch

수행 할 작업 :
다음 node-sass과 같이 globaly 를 설치해야합니다 .

npm install node-sass -g

그런 다음 명령 줄을 다시 시작한 다음 다음 코드를 사용합니다.

node-sass --watch scss/styles.scss css/styles.css

scass 파일을 css로 컴파일합니다.
기본적으로 node-sass는 --watch명령을 지원하며이를 사용하여 scss 코드를 일반 css 파일로 컴파일합니다.

.scss 파일을 처음 저장할 때 다음과 같은 오류가 발생하는 경우 :

{
  "status": 3,
  "message": "File to read not found or unreadable: yourdirectory/scss/styles.scss",
  "formatted": "Internal Error: File to read not found or unreadable: yourdirectory/scss/styles.scss\n"
}

다시 저장하면 올바르게 작동합니다!

참고URL : https://stackoverflow.com/questions/18427849/how-to-watch-changes-in-whole-directory-folder-containing-many-sass-files

반응형