Create React App Service worker를 팝업 없이 확장 또는 사용자 정의하는 가장 간단한 방법

...
"start": "cra-append-sw --mode dev --env ./.env ./firebase-messaging-sw.js && react-scripts start",
"build": "cra-append-sw --env ./.env ./firebase-messaging-sw.js && react-scripts build",
...

이것은 cra-append-sw가 개발 모드에서 실행될 때 (공용 폴더에 작업 프로그램을 생성하는 것이지react 서비스 worker에 추가하는 것이 아닙니다) 수동으로 등록할 수 있도록 하기 위해서입니다

이것이 바로 당신이 필요로 하는 것입니다.동일한 목표를 달성하려는 다른 해커 도구에 비해 간단명료하다

이 파이프를 사용하는 가장 해결하기 어려운 문제 중 하나는 Firebase 접근 키와 내 데이터베이스에 있는 다른 비밀 변수를 설정하기 위해 서비스 직원들에게 환경 변수를 어떻게 사용하는지 발견했습니다.환경 파일.이 해결 방안은 정상적인 모드와 개발 모드에서 코드를 출력하기 전에 코드는 웹 패키지 파이프를 통해 실행되기 때문에 이 문제를 해결했다.이것은 사용자 정의 서비스 인원 코드의 process.env 대상에 접근할 수 있음을 의미합니다

고통을 덜어주고Create React 응용 프로그램에 새로운 서비스 인원 기능을 추가해서 행복한 생활을 할 수 있기를 바랍니다

추가 설명 및;편집:

• cra-append-sw 프로덕션 모드에서 실행할 때 리뷰에서 지적한 바와 같이 서비스 직원을 수동으로 등록할 이유가 없습니다.비록 개발 모델에서 이것은 필요한 것이기 때문에 나는 index.tsx 파일에 요점을 추가했다.나는 지금 그것을 업데이트하고 환경을 검사했으며 dev에서만 그것을 실행합니다. 다음은 cra-append-swdocumentation의 관련 부분입니다.
  

dev creates public/<file> instead of appending the code to build/service-worker.js
build creates build/<file> instead of appending the code to build/service-worker.js

• 댓글의 범위를 조금 넘어섰지만 댓글에 the firebase-messaging-sw.js that I ended up using를 요구했다.이것은 내가 인터넷에서 찾은 몇 가지 해결 방안의 프랑켄슈타인이다. 만약 내가 잘못 기억하지 않았다면, 나는 지금 그것들을 증명할 출처를 찾을 수 없다.만약 당신이 요점을 알고 있다면, 평론에서 저에게 알려주십시오☀️
• 지적한 바와 같이 귀하의 서비스 인원 등록 대상을 생산 중인 Firebase 메시지 getToken() 옵션에 전달할 필요가 있을 수 있습니다. (Firebase 서비스 인원을 CRA 서비스 인원에 추가할 때). 그러나 일부 이유로 Firebase 서비스 인원이 없는 경우 저에게 유효합니다.