2014-01-27 3 views
6

며칠 전 Webstorm을 사용하여 scss 작업을 시작했으며 scss 파일을 저장 한 후 CSS 파일을 자동 생성/업데이트하는 것처럼 보입니다. 불행히도 scss 파일을 저장하면 CSS 파일이 변경되지 않습니다. 다른 위치에서이 파일을 작업 중이므로 Webstorm 설정이 다를 수 있습니다. 나는 파일 감시자가 그와 관련이 있을지도 모른다고 생각했지만 프로그램 분야에 무엇이 들어 있는지 확신하지 못한다. 왜 이런 일이 벌어지고 있는지 모르겠습니다.scss 파일에 저장하면 자동으로 CSS 파일이 업데이트됩니까?

답변

10

아니요, .SCSS 파일을 저장해도 최종 스타일 시트 파일이 자동으로 컴파일되지 않습니다. 당신이해야 할 일은 시계를 세우는 것입니다. 이를 수행하는 방법에는 여러 가지가 있습니다 (그리고 여러 가지 프로그램이 있습니다).

가장 직접적인 것은 명령 행을 통한 것입니다. 당신이 SASS 보석 설치 한 가정 (당신은 루비 환경에있어), 명령 줄에서 다음을 수행하십시오

  1. 이동을하여 .scss 파일/S가 유지되는 폴더로 이동합니다. sass --watch style.scss:style.css

참고 :

  • 는 다음 명령을 실행 위는 그렇지 않은 경우에 따라 조정, 당신의 .scss 및 .CSS 파일을 모두 스타일의 이름을 지정하는 것으로 가정합니다. 또한 .css 및 .scss 파일이 다른 디렉토리에 있으면 경로를 그에 따라 조정해야합니다.

    기억

    , sass --watchyourScssFile.scss :

    yourCssFile.css은 또한 당신은 당신을 위해 파일을 볼 LiveReload 같은 응용 프로그램을 사용할 수 있습니다. 이것은 약간의 구성을 취할 것입니다 만, SCSS/SASS의 낡은 세계에서 시작하기 만하면 조금 쉬울 수도 있습니다.

  • +0

    이 작업을 수행하는 프로그램을 제안 할 수 있습니까? – Randomishlying

    +1

    내 대답에 대한 제안을 추가했습니다 :) – monners

    +0

    이것은 또한 도움이 될 수 있습니다 (당신이 Mac에 있다고 가정) http://mac.appstorm.net/roundups/internet-roundup/5-mac-apps-that-make- css-preprocessors-easy-to-use/ – monners

    0

    Yopu는 WebStorm의 File Watchers를 사용하여 SCSS 변경시 CSS 파일. 그러나 외부 SCSS 컴파일러 (SASS gem)를 설치해야 할 수도 있습니다. 자세한 내용은 http://www.jetbrains.com/webstorm/webhelp/transpiling-sass-less-and-scss-to-css.html#d104715e458을 참조하십시오.

    +0

    Jetbrain의 PyCharm IDE도 마찬가지입니다. SASS 파일을 생성하거나 편집하면 파일 편집기 맨 위에있는 도구 모음을 통해 아주 쉽게 감시자를 추가 할 수 있습니다. –

    관련 문제