[angular-cli] Angular CLI 즐겨 찾기 아이콘을 변경하는 방법

Angular CLI에서 설정 한 기본 즐겨 찾기 아이콘은 어떻게 변경합니까?

나는 많은 것을 시도했지만 그 아이콘 (src 폴더의 favicon.ico)을 삭제했지만 항상 Angular 로고를 즐겨 찾기 아이콘으로 표시합니다. 그것은 여전히 ​​표시되며로드 된 곳을 모르겠습니다.

해당 아이콘을 다른 아이콘으로 교체했지만 여전히 Angular 로고가 표시됩니다.

<link rel="icon" type="image/x-icon" href="favicon.ico">



답변

같은 이름 ( favicon.png) 으로 png 이미지를 만들고 다음 파일에서 이름을 변경하십시오.

index.html:

<link rel="icon" type="image/x-icon" href="favicon.png" />

angular-cli.json:

"assets": [
    "assets",
    "favicon.png"
],

그리고 각도 기본 아이콘은 다시 표시되지 않습니다.

이보다 크면 표시되지 않는 크기는 32×32 여야합니다.

참고 : Angular 9에서는 작동하지 않습니다

각도 9의 경우 자산 안에 파비콘을 넣고 경로를 지정해야합니다.

<link rel="icon" type="image/x-icon" href="assets/favicon.png">


답변

favicon.ico파일을 실제로 바 꾸었으므로 어딘가에 캐싱 문제가 있어야합니다. 브라우저에 캐시가 있습니다. Ctrl+ 를 눌러 플러시되도록 F5합니다.

기본 아이콘이 여전히 표시되면 캐시를 정리 한 다른 브라우저를 사용해보십시오 (예 : 해당 브라우저가있는 페이지를 아직 방문하지 않은 경우).

캐시 바로 가기 지우기 : ( 소스 )

Windows

IE : Ctrl+ R; Firefox : Ctrl+ Shift+ R; 크롬 : Ctrl+ RCtrl+ F5Shift+ F5.



사파리 : + R; Firefox / Chrome : + Shift+ R.


답변

파일을 탐색하면 마침내이 문제가 해결되었습니다. 제 경우에는 http : // localhost : 4200 / favicon.ico

새로 고침을 중지하고 ng serve다시 시작한 후 “Empty Cache and Hard Reload”는 작동하지 않았습니다.


답변

브라우저가 새 버전의 파비콘을 다운로드하고 캐시 된 버전을 사용하지 않도록하려면 파비콘 URL에 더미 매개 변수를 추가 할 수 있습니다.

<link rel="icon" type="image/x-icon" href="favicon.ico?any=param">


답변

각도 CLI favicon 아이콘을 변경할 수 있습니다. 아이콘 파일을 “assets”폴더에 넣고 index.html에 해당 경로를 지정해야합니다.

<link rel="icon" type="image/x-icon" href="./assets/images/favicon.png">

그것은 나를 위해 일하고 있습니다.


답변

Angular에 문제가 있다고 생각하면서 이것으로도 어려움을 겪었지만 Chrome의 아이콘을 캐싱하는 문제가 발생했습니다. 표준 “빈 캐시 및 하드 다시로드”또는 브라우저를 다시 시작하는 것이 효과가 없었지만 이 게시물 에서 올바른 방향으로 지시했습니다.

이것은 특히 나를 위해 일했다 :

Windows에서 크롬을 사용하는 경우 (exit chrome from taskbar) C:\Users\your_username\AppData\Local\Google\Chrome\User Data\Default
은 Favicons-journal, Favicons 파일 로 이동하여
삭제 한 다음 작업 표시 줄에서 크롬을 다시 시작합니다 ( kill all instances).

이것이 효과가 없다면 그 게시물에 다른 좋은 제안이 많이 있습니다.


답변

Angular 6의 경우 favicon.png32x32 경우 자산 폴더 에 크기 를 에서 경로를 변경하십시오 index.html. 그때,

<link rel="icon" type="image/x-icon" href="./assets/favicon.png">