File Watchers SCSS

다른사람이 하던 프로젝트를 이어 받아서 하게 되었는데, vscode를 사용해서 작업을 하셨고, scss를 사용하면서 css가 만들어질때 source map을 사용하지 않게 세팅을 하셨다.(source map파일은 있는게 더 좋은데 왜 그런지 모르겠다)

나는 intellij를 사용하기에 거기에 맞는 세팅을 해야하는 상황이라 정리해 본다.

우선 먼저분이 웹팩을 사용하지 않았기 때문에 intellij에서 제공되는 플러그인인 file watchers를 사용하기로 했다.

source map을 만들지 말아야 하기 때문에 Arguments속성에서 해당 부분을 적어준다.

--no-source-map $FileName$:$ProjectFileDir$/mobile/src/main/webapp/assets/css/$FileNameWithoutExtension$.css

--no-source-map 은 source map을 만들지 않겠다는 옵션 설정이고, $로 감싸진 변수명은 intellij내부에서 사용되는 변수명이다.

또한 렌더링되는 css파일의 위치가 다를 경우(보통은 scss파일과 css파일이 같이 있는데 먼저분이 다른 폴더에 넣어 놓으셨다!) Output paths to refresh 부분에 경로를 설정해 줘야 한다.

$ProjectFileDir$/mobile/src/main/webapp/assets/css/$FileNameWithoutExtension$.css