vscode sass 컴파일 오류가 발생하면 어떻게 해야 할까요?

vscode sass 컴파일 시 오류가 발생하면 어떻게 해야 하나요?

vscode를 사용하여 sass를 컴파일하세요

명령줄을 통해 컴파일하려면 https://www.sass.hk/를 따라 여기로 이동하여 단계별로 설치하세요. Taobao 이미지 설치 시 문제 발생 설치에 실패하여 vscode를 사용하여 sass를 컴파일했습니다

추천 학습: vscode 튜토리얼

첫 번째 단계는 vscode에서 쉬운 sass를 설치하는 것입니다

두 번째 단계는 vscode의 구성을 수정하는 것입니다.

"easysass.compileAfterSave": true, 
 "easysass.formats": [ //nested：嵌套缩进的 css 代码。
//expanded：没有缩进的、扩展的css代码。
//compact：简洁格式的 css 代码。
//compressed：压缩后的 css 代码
        {
            "format": "expanded",
            "extension": ".css"
        },
        {
            "format": "compressed",
            "extension": ".min.css"
        }
    ],
    "easysass.targetDir": "css/" //路径

세 번째 단계는 새 폴더를 만들고 폴더에 두 개의 새 폴더를 만드는 것입니다. 하나는 sass용이고 다른 하나는 css용입니다. css 폴더, 컴파일 후 폴더가 자동으로 생성됩니다.

네 번째 단계, sass 아래에 데모.sass를 만든 다음

.box
    color: red
    .img
        width: 100%;
        display: block;

라고 작성합니다. 다섯 번째 단계, ctrl + s를 누르면 컴파일됩니다. 이전에 설정할 때 easysass.compileAfterSave를 직접 설정했기 때문에 저장 후 한 번 컴파일됩니다. 이는 개발 효율성을 높이기 위한 것이기도 합니다.

마지막으로 CSS 아래에 추가 CSS 파일이 있는 것을 확인할 수 있습니다. , min.css 파일입니다. 들여쓰기가 없는 파일과 압축이 있는 파일이 있습니다.

그렇습니다.

위 내용은 vscode sass 컴파일 오류가 발생하면 어떻게 해야 할까요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!