scss/css에서 파일 이름 "_" 또는 "_" 앞에 붙이는 이유는 무엇입니까?

scss/css에서 파일 이름 "_" 또는 "_" 앞에 붙이는 이유는 무엇입니까?

왜 넣어요?_scss의 파일 이름 앞에?

_filename.scss필요한 이유_?

_(밑줄)은 scss의 일부입니다.즉, 스타일시트를 주 스타일시트(예: styles.scss)로 가져올 것입니다(@import).partials를 사용할 때의 장점은 코드를 구성하는 데 많은 파일을 사용할 수 있고 모든 것이 하나의 파일로 컴파일된다는 것입니다.

파일 이름 앞에 "_"를 포함할 때 부분적이지 않은 다른 sas 파일로 가져오지 않는 한 CSS로 생성되지 않습니다.

당신의 폴더 구조가 이와 같다고 가정합니다.

/scss
 style.scss
 _list.scss
/css

명령을 실행하는 경우

sass --watch scss:css

style.css와 style.css.map 파일만 생성되고 sass 컴파일러는 내용을 CSS 파일로 변환하지 않고 _list.scss를 생략합니다.

/scss
 style.scss
 _list.scss
/css
 style.css
 style.css.map

partials를 사용할 수 있는 유일한 방법은 다른 .scss 파일로 가져오는 것입니다.

@import 'list.scss';

_list.scss 앞의 '_'를 제거하면 명령어의 결과는 다음과 같습니다.

/scss
 style.scss
 list.scss
/css
 style.css
 style.css.map
 list.css
 list.css.map

부분적인 부분을 사용하는 주요 목적은 CSS 코드를 유지 관리하기 쉬운 여러 부분으로 분해하는 것입니다.이게 도움이 되길 바랍니다.감사해요.

밑줄로 시작하는 SAS 파일은 부분적입니다.이것은 여러분의 스타일을 논리적인 섹션으로 구분하는 좋은 방법입니다.이 파일들은 당신이 사용할 때 컴파일할 때 모두 병합됩니다.@import.

Sass 언어 안내서:

다른 Sass 파일에 포함할 수 있는 CSS의 작은 스니펫을 포함하는 부분 Sass 파일을 만들 수 있습니다.이것은 CSS를 모듈화하고 유지 관리를 쉽게 하는 데 도움이 되는 좋은 방법입니다.부분은 단순히 선행 밑줄이 있는 Sas 파일입니다._partial.scss와 같은 이름을 붙일 수 있습니다.Sass는 밑줄을 사용하여 파일이 부분 파일일 뿐이며 CSS 파일로 생성되지 않아야 함을 알 수 있습니다.SAS 부분은 @import 지시문과 함께 사용됩니다.

http://sass-lang.com/guide

_(밑줄)이 있는 파일은 컴파일러에 의해 무시됩니다.그러나 이러한 모든 파일은 실제로 컴파일되는 파일인 단일 메인 SCSS 파일(예: styles.scss)로 가져옵니다(이름에 _(밑줄)이 없습니다).

최종 목표는 하나의 SCSS 파일만 컴파일하고 그 결과 하나의 CSS 파일만 보유하는 것으로 다양한 장점이 있습니다.

_는 부분을 나타내는 데 사용됩니다.이러한 부분은 전처리 단계에서 필요한 변수와 내부 함수를 포함하고 있으며, CSS로 컴파일할 필요는 없습니다._ 부분 템플릿에는 css를 css로 컴파일하는 데 필요한 utils, scss 로컬 변수 및 함수가 포함되어 있습니다.

설명서의 내용은 다음과 같습니다.

관례적으로, 자체적으로 컴파일되지 않고 [가져올 모듈]로만 로드되도록 의도된 Sass 파일은 _(_code.scss에서처럼)로 시작합니다.이것들은 부분적인 것이라고 불리는데, 그들은 Sass 도구들에게 그 파일들을 스스로 컴파일하려고 하지 말라고 말합니다.부분을 가져올 때 _를 생략할 수 있습니다.

또한 Sass 부분은 @import와 함께 사용하지 말고 @use와 함께 사용해야 합니다.

Sass 팀은 @import 규칙을 계속 사용하지 않도록 합니다.Sass는 앞으로 몇 년 동안 단계적으로 그것을 제거할 것이고, 결국 언어에서 그것을 완전히 제거할 것입니다.대신 @사용 규칙을 선호합니다.(현재 Dart Sass만 @use를 지원합니다.다른 구현의 사용자는 대신 @import 규칙을 사용해야 합니다.)

이는 원래 질문의 범위를 벗어나지만, 궁금하다면 다음과 같은 이유가 있습니다.

@가져오기 규칙에는 여러 가지 심각한 문제가 있습니다.

• @import를 사용하면 모든 변수, 믹스인 및 함수에 전역적으로 액세스할 수 있습니다.이로 인해 사람(또는 도구)이 정의된 위치를 파악하기가 매우 어렵습니다.
• 모든 항목이 글로벌하기 때문에 라이브러리는 이름 충돌을 방지하기 위해 모든 구성원에게 접두사를 붙여야 합니다.
• @임시 규칙도 글로벌하므로 어떤 스타일 규칙이 확장될 것인지 예측하기 어렵습니다.
• 각 스타일시트는 @import될 때마다 실행되고 CSS가 방출되어 컴파일 시간이 증가하고 더부룩한 출력이 생성됩니다.
• 다운스트림 스타일시트에 액세스할 수 없는 개인 구성원 또는 자리 표시자 선택기를 정의할 수 있는 방법이 없습니다.

또한 노드 환경에서 노드 패치 감시기를 사용하면 밑줄 접두사가 없는 경우 오류 메시지가 표시됩니다. https://github.com/sass/node-sass/issues/2762 을 참조하십시오.

언급URL : https://stackoverflow.com/questions/34889962/why-put-in-front-of-the-file-name-or-in-scss-css