2주 전에 제 것을 출판했습니다Gatsby plugin as an NPM package.요컨대, 게이츠비의 글꼴로 플러그인을 불러오는 것은 이미 유행이 지났고, 환영을 받지 못하며, 일부 기능이 부족하다는 것을 알아차렸기 때문에, 나는 플러그인을 개발했다. 만약 그것이 흡인력을 얻게 된다면, 나는 적극적으로 그것을 유지하고 싶다.너는 나의 이전 댓글에서 이 이야기에 관한 내용을 더 많이 읽을 수 있다.

비동기적으로 글꼴을 로드하고 FOUT를 처리하기 위해 내 게이츠비 플러그인을 사용합니다.

아드리안 베스・ 11월 3일・ 5분 읽기

#react #gatsby #webdev #javascript

요 2주 동안 내 소프트웨어 패키지는 거의 800번의 다운로드를 받았다.저는 자신의 NPM 패키지를 발표하고 오픈소스 프로젝트를 유지하는 경험을 배웠습니다. 본고에서 여러분과 공유하고 싶습니다.

코다드리안 / 게이츠비오니 글꼴 로더

글꼴 마운트는 최적화를 거쳐 최상의 성능을 얻는다.렌더링을 제거하면 글꼴 리소스가 비동기적으로 로드되지 않습니다.글꼴 로드 상태 모니터를 사용하여 FOUT 및 FOUC를 처리합니다.로컬 트랜잭션 글꼴과 웹 글꼴을 지원합니다.

개츠비 옴니 글꼴 로더

게이츠비에 비동기 글꼴을 실행하기 위해 플러그인을 불러옵니다.

네트워크 글꼴 및 자체 관리형 글꼴 지원

파일을 미리 로드하고 URL에 미리 연결

렌더링 장애를 방지하기 위해 비동기적으로 글꼴을 로드합니다

.

및 fast loading snippets 구축

FOUT를 피하기 위해 상태 탐지기를 로드합니다

.

작고 작은 설치 공간

설치하다.

npm install --save-dev gatsby-omni-font-loader또는yarn add --dev gatsby-omni-font-loader

프로비저닝

다음 코드 세그먼트를 gatsby-config.js 플러그인 그룹에 추가합니다.
{
/*플러그인 포함*/
해석: "게이츠비오니 글꼴 마운트",
/* 플러그인 옵션*/
옵션:
/* FOUT를 처리하기 위해 글꼴 로더 탐지기를 사용합니다*/
enableListener: 맞아요.
/* URL-s에 미리 연결합니다. 이 예는 구글 글꼴에 적용됩니다.*/
사전 접속: ["https://fonts.gstatic.com"],
/* 글꼴 탐지기 간격(ms).기본값은 300ms입니다.권장사항: >=300ms*/
간격:300,
/* 글꼴 탐지기 시간 초과값(ms).기본값은 30초(30000ms)입니다.탐지기는 시간 초과 후 불러오는 글꼴, 글꼴을 더 이상 검사하지 않습니다.
View on GitHub

사유를 개시하다.

당신은 유용하고 중복 사용이 가능하며 정교하게 만들어진 제품을 개발해 냈습니까?왜 그것을 NPM 패키지로 발표하지 않습니까?
당신이 원하는 NPM 패키지를 오픈하고 발표하는 것을 고려하세요.더 많은 개발자들이 이 코드들이 매우 유용하다는 것을 발견할 가능성이 높기 때문이다.
그러나 만약 당신이 이 가방을 발표하기로 결정한다면, 당신도 그것을 유지해야 한다는 것을 기억해야 한다.만약 이 소프트웨어 패키지가 지역 사회에서 흡인력을 얻었다면, 기능 요청과 끌어당기기 요청을 포함한 몇 가지 문제에 부딪힐 수 있습니다.
이제 발표 가방에 중점을 두자.

NPM 모범 사례

제가 1년 전에 쓴 글에서 NPM 모범 사례를 개괄적으로 설명했습니다.

최적 npm 패키지 선택 목록

아드리안 베스・ 19년 8월 22일・ 3분 읽기

#npm #node #beginners #javascript

이것은 당신의 NPM 패키지에 대해 무엇을 의미합니까?

종속 패키지를 최신으로 유지하여 빈틈이 없도록 확보

보고된 문제 해결

질문, 기능 요청, 질문 등을 발표한 사람과 접촉

최적화된 패키지 및 코드

지역사회에 왜 당신의 소프트웨어 패키지가 경쟁사 위에 있는지 알려주세요

GitHub은 재구매 계약에 취약점이 있을 경우 알려 줍니다.

고치기 위해 자동 PRs를 작성하기도 합니다.

고품질의 풍부한 정보 문서

지역 사회에서 NPM 패키지의 용도, 그들이 왜 그것을 필요로 하는지, 어떻게 사용하는지 알 수 있도록 정보가 풍부한 문서를 제공해야 한다.
일반적으로 재구매 협의에 README.md 증빙 서류를 추가할 수 있는데 이것은 보통 다음과 같은 특징을 가지고 있다.

포장에 대한 간략한 설명

설치 방법

가장 간단한 용례

구성에 사용할 수 있는 옵션

예제 및 프롬프트

FAQ 또는 문제 해결(NPM 패키지와 무관한 문제가 반복되지 않도록 함)

결함 보고 및 기여

개발자가 당신의 npm 패키지를 다운로드하고 사용할 때, 요청 기능을 발견하거나, 요청을 보내거나 문제를 제기하는 것을 피할 수 없습니다.
건강한 사용자 그룹을 유지하고 사용자와 상호작용하는 것이 NPM 패키지의 실행과 사용을 유지하는 가장 좋은 방법이다.NPM 가방 하나에 10개 이상의 문제가 현안으로 남아 있고 몇 주 동안 회답이 없는 것을 보는 것을 좋아하는 사람은 없다.이것은 사용자가 당신의 소프트웨어 패키지를 사용하는 것을 막을 것이다.

만약 소포에 견인력이 없다면 어떻게 합니까?

본문을 작성할 때 NPM에는 마침 1445808개의 가방이 있었다.따라서 가방에 견인력이 없거나 널리 사용되지 않는다면 이상하지 않다.너는 네가 개발하기로 결정한 모든 소프트웨어 패키지에 대해 적어도 십여 개의 예비 방안이 있기 때문에 두드러진 특성을 가지는 것이 매우 중요하다고 내기할 수 있다.
그런데 소포에 견인력이 없으면 어떡하지?다음을 수행할 수 있습니다.

정보 전파 - 소셜 미디어, 개발 포럼과 채널에서 공유하고 글을 작성하며 문서를 개선할 수 있습니다. 동료가 시도해 보십시오.

반대

계속 일할 다른 사람에게 소유권을 양도

만약 가방에 의존 항목이 있다면, 빈틈을 남기고 싶지 않기 때문에, 가방을 계속 유지하지 않기로 결정한다면, 사용하지 않는 것이 가장 좋다.

결론

NPM 패키지를 발표하는 것은 단지 일로영일의 일이 아니다.귀하의 의존 관계는 이미 유행이 지났을 수 있습니다. 이것은 안전 문제를 초래할 수 있습니다. 사용자는 문제를 제기하고, 오류를 보고하며, 인출 요청을 제공할 수 있습니다.
패키지를 발표하려면 언제든지 사용자와 의사소통을 준비하고 의존항이 최신식인지 확인하십시오.
이 물품들은 커피가 연료를 제공한다.그래서 만약 당신이 나의 일을 좋아하고 그것이 매우 유용하다고 생각한다면, 나에게 커피 한 잔을 사주는 것을 고려해 보세요.고맙겠습니다.

시간을 내서 본문을 읽어 주셔서 감사합니다.만약 네가 이것이 유용하다고 생각한다면 그것을 하나 주어라❤️ 혹은🦄, 공유와 평론.