기여하다

설명서 빌드 스크립트 및 테스트를 통해 부트스트랩 개발을 돕습니다.

이 페이지에서

툴링 설정

부트스트랩은 npm 스크립트 를 사용하여 문서를 작성하고 소스 파일을 컴파일합니다. package.json 에는 코드 컴파일, 테스트 실행 등을 위한 스크립트가 들어 있습니다 . 이는 저장소 및 문서 외부에서 사용하기 위한 것이 아닙니다.

빌드 시스템을 사용하고 문서를 로컬에서 실행하려면 부트스트랩의 소스 파일과 Node.js의 사본이 필요합니다. 다음 단계를 수행하면 흔들 준비가 된 것입니다.

종속성을 관리하는 데 사용하는 Node.js를 다운로드하여 설치 합니다.
Bootstrap의 소스를 다운로드 하거나 Bootstrap의 저장소 를 포크 하십시오.
루트 /bootstrap디렉토리 로 이동하고 package.jsonnpm install 에 나열된 로컬 종속성을 설치하기 위해 실행합니다 .

완료되면 명령줄에서 제공되는 다양한 명령을 실행할 수 있습니다.

npm 스크립트 사용

package.json 에는 프로젝트 개발을 위한 수많은 작업이 포함되어 있습니다 . npm run터미널에서 모든 npm 스크립트를 보려면 실행 하십시오. 기본 작업은 다음과 같습니다.

일	설명
`npm start`	CSS 및 JavaScript를 컴파일하고 문서를 빌드하고 로컬 서버를 시작합니다.
`npm run dist`	`dist/`컴파일된 파일 이 있는 디렉터리를 만듭니다 . Sass , Autoprefixer 및 terser 를 사용 합니다 .
`npm test`	실행 후 로컬에서 테스트 실행`npm run dist`
`npm run docs-serve`	문서를 로컬에서 빌드하고 실행합니다.

스타터 프로젝트로 npm을 통해 부트스트랩을 시작하세요! twbs /bootstrap-npm-starter 템플릿 저장소로 이동하여 자신의 npm 프로젝트에서 부트스트랩을 빌드하고 사용자 정의하는 방법을 확인하십시오. Sass 컴파일러, Autoprefixer, Stylelint, PurgeCSS 및 Bootstrap 아이콘을 포함합니다.

사스

Bootstrap은 Sass 소스 파일을 CSS 파일로 컴파일하기 위해 Dart Sass 를 사용하며(빌드 프로세스에 포함됨) 자체 자산 파이프라인을 사용하여 Sass를 컴파일하는 경우에도 동일한 작업을 수행하는 것이 좋습니다. 이전에 Bootstrap v4에 Node Sass를 사용했지만 LibSass 및 Node Sass를 포함하여 이 위에 빌드된 패키지는 더 이상 사용되지 않습니다 .

Dart Sass는 10의 반올림 정밀도를 사용하며 효율성을 위해 이 값의 조정을 허용하지 않습니다. 축소와 같이 생성된 CSS를 추가로 처리하는 동안에는 이 정밀도를 낮추지 않지만 그렇게 하도록 선택한 경우 브라우저 반올림 문제를 방지하기 위해 정밀도를 6 이상으로 유지하는 것이 좋습니다.

자동 접두사

Bootstrap은 Autoprefixer (빌드 프로세스에 포함)를 사용하여 빌드 시 일부 CSS 속성에 공급업체 접두사를 자동으로 추가합니다. 그렇게 하면 v3에서 볼 수 있는 것과 같은 공급업체 믹스인이 필요하지 않고 CSS의 핵심 부분을 한 번에 작성할 수 있으므로 시간과 코드가 절약됩니다.

Autoprefixer를 통해 지원되는 브라우저 목록을 GitHub 리포지토리 내의 별도 파일에 유지 관리합니다. 자세한 내용은 .browserslistrc 를 참조하세요.

RTLCSS

부트스트랩은 RTLCSS 를 사용하여 컴파일된 CSS를 처리하고 RTL로 변환합니다. 기본적으로 수평 방향 인식 속성(예: padding-left)을 반대 속성으로 대체합니다. CSS를 한 번만 작성하고 RTLCSS 제어 및 값 지시문을 사용하여 약간만 조정할 수 있습니다.

현지 문서

문서를 로컬에서 실행하려면 Hugo -bin npm 패키지 를 통해 설치되는 Hugo를 사용해야 합니다. Hugo는 기본 포함, Markdown 기반 파일, 템플릿 등을 제공하는 매우 빠르고 확장 가능한 정적 사이트 생성기입니다. 시작하는 방법은 다음과 같습니다.

위의 도구 설정 을 실행하여 모든 종속성을 설치합니다.
루트 /bootstrap디렉터리 npm run docs-serve에서 명령줄에서 실행합니다.
http://localhost:9001/브라우저에서 열고 짜잔.

설명서 를 읽고 Hugo 사용에 대해 자세히 알아보세요 .

문제 해결

종속성 설치에 문제가 발생하면 모든 이전 종속성 버전(글로벌 및 로컬)을 제거하십시오. 그런 다음 을 다시 실행 npm install하십시오.