제안:

1. 모든 마크업 요소에 의미 클래스를 추가합니다. (그러나 아직 스타일 지정에는 사용하지 않고 표시 및 라이브러리 클래스를 마크업에 유지합니다).
2. 스타일시트 내의 스타일을 의미론적 클래스로 이동합니다(믹스인을 통해 또는 바람직하게는 @extend s ).
3. 통합/승인 테스트의 경우 시맨틱 클래스로 업데이트합니다.
4. 마크업에서 표현 및 라이브러리 클래스를 제거합니다.

이 단계에서 페이지 모양이 전혀 변경되어서는 안 됩니다. PhantomCSS 의 사용 사례일 수 있습니다.

완료되면 시맨틱 클래스를 사용자 지정 CSS 스타일 지정을 위한 API로 사용할 수 있습니다.

CSS 클래스에 대한 참고 사항:

저는 _ 모듈식 CSS 클래스 이름을 위한 단순 명명 _ 에 기반한 것들을 가지고 놀았고 대부분의 요소에 view--component--element 와 같은 3점 식별자를 부여하기로 결정했습니다.

이중 대시를 사용하면 처음에는 눈살을 찌푸리게 되지만 이러한 클래스는 스타일을 지정하는 것뿐만 아니라 테스트를 작성하는 데에도 용이합니다.

1단계 PR을 보내려고 합니다.

@wwebfor 로컬에서 앱을 시작하려면 어떻게 해야 합니까? grunt serve 는 다음을 출력합니다.

@filtercake , 당신은 grunt task로 더 적은 파일을 컴파일해야 합니다: grunt lessc

관련 문제:

226 요청: 야간 모드

421 다크 테마