각도 4+ 프로젝트에 글꼴을 멋지게 추가하는 방법

scss를 사용하여 Angular 4+ 프로젝트에 font-awesome을 추가하는 데 문제가 있습니다. 나는 여기에 주어진 많은 단계를 시도했다 : 주로 @import '~/../node_modules/font-awesome/scss/font-awesome'; to styles.scss과 $fa-font-path : '~/../node_modules/font-awesome/fonts';에서 variables.scss을 추가하는 scss 기반 프로젝트의 경우 How to add font-awesome to Angular 2 + CLI project을 시도했다. 것은 컴파일하고 그것이 작동하는 것처럼 보입니다. 최소한 아이콘이 있어야하는 블록을 얻었 기 때문에, 아무 것도 얻지 못했지만, 그게 전부입니다. 각도 CLI에서 CSS 파일 가져 오기를 시도 할 수는 있지만 scss 방식으로 처리하는 것이 좋습니다. 각도 4+ 프로젝트에서 누구나 성공 했나요?각도 4+ 프로젝트에 글꼴을 멋지게 추가하는 방법

각도 4의 문제인데 앵귤러 2가 아니라 해당 게시물의 댓글을 기반으로 한 게시물이 오래 되었기 때문에 새로운 주제에 게시하고 있습니다.

출처

2017-10-24 jgerstle

를 통해로드 할 수 있습니다 angular-cli.json을 통해 webpack bundler를 사용하여이를 자산으로 포함시키고 자산에 대한 링크를 타겟팅해야합니다. –

내 scss에서 가져오고 싶습니다 – jgerstle

이 답변을 사용하여 마지막에 가져 왔습니다 : https://stackoverflow.com/a/45147045/1259742 – jgerstle

Npm 설치 글꼴 awesome 및 .angular-cli.json 파일의 스타일을 추가하면 번들로 제공됩니다.

출처

2017-10-24 14:47:31

내가 할 때 동일한 문제가 발생합니다 (아이콘 대신 상자).). 게다가 차라리 내 scss 파일에 넣고 앵귤러 cli에 넣지 않을 것입니다. – jgerstle

font-awesome.css를 포함하고 있습니까? 가져 오기를 사용하여 말하는 것처럼 scss 파일에서 가져올 수도 있습니다. –

가져 오기를 사용하여 내 scss 파일에서 가져오고 싶지만 아이콘 대신 상자가 나타납니다. 아니요. scss를 사용하고 싶다고 말한 것처럼 scss 파일을 사용하지 않았습니다. 다른 모든 실패하는 경우 CSS를 사용할 수 있지만 추측 일관성이 줄 것. – jgerstle

당신은 당신의 스타일에 글꼴 파일을 가리키는하여이 작업을 수행 할 수 있습니다

// styles.scss 
$fa-font-path: "../node_modules/font-awesome/fonts"; 
@import '~font-awesome/scss/font-awesome.scss';

또는 다른 언급이 당신이 그것을 컴파일하지 않으려면, 당신은 웹팩

// angular-cli.json 
"styles": [ 
    "../node_modules/font-awesome/scss/font-awesome.scss", 
    "styles.scss" 
]

출처

2017-10-24 16:21:12 LLai

각도 4+ 프로젝트에 글꼴을 멋지게 추가하는 방법

답변

관련 문제