설정 파일을 저장한 후, 서버를 껐다가 재시작하세요. 이제 utils.scss 파일을 불러올 때 현재 수정하고 있는 scss 파일 경로가 어디에 위치하더라도 앞부분에 상대 경로를 입력할 필요 없이 styles 디렉터리 기준 절대 경로를 사용하여 불러올 수 있습니다.
노트 개발 서버가 시작되지 않나요?
yarn eject 이후 개발 서버가 제대로 시작되지 않는 현상이 발생한다면 프로젝트 디렉터리의 node_modules 디렉터리를 삭제한 후, yarn install 명령어를 실행하고 나서 yarn start를 해 보세요.
SassComponent.scss 파일에서 import 구문을 다음과 같이 한번 수정해 보세요. 그리고 똑같이 적용되는지 확인해 보세요.
@import 'utils.scss';
이제부터 utils.scss를 사용하는 컴포넌트가 있다면 위 한 줄만 넣어 주면 됩니다.
하지만 새 파일을 생성할 때마다 utils.scss를 매번 이렇게 포함시키는 것도 귀찮을 수 있을 텐데요. 이에 대한 해결 방법 또한 있습니다. 그럴 때는 sass-loader의 data 옵션을 설정하면 됩니다. data 옵션을 설정하면 Sass 파일을 불러올 때마다 코드의 맨 윗부분에 특정 코드를 포함시켜 줍니다.