TA貢獻1860條經驗 獲得超8個贊
CRA 不會使用默認安裝命令直接為 Service Worker 提供支持，因為開發人員可能不會將應用程序制作為 PWA。因此，他們決定將其保留為可選。和我一樣，如果您其他人想在創建新應用程序時安裝 Service Worker，請首選：
npx?create-react-app?my-app?--template?cra-template-pwa
而不是默認的npx create-react-app my-app.?
TA貢獻1998條經驗 獲得超6個贊
如果您已經有現有項目并且想要遷移到新版本的 CRA，您可以按照以下步驟操作：
1 使用 Service Worker 模板在計算機上的某個位置創建一個新的 CRA：
npx create-react-app my-app --template cra-template-pwa
2 將 service-worker.js 從新創建的應用程序復制到您的 src 目錄中
3 將 package.json 中的“workbox-*”依賴項復制到 package.json 依賴項中
4 （可選）如果您需要 web-vitals，請將 web-vitals 依賴項從 package.json 復制到 package.json
并且不要忘記再次運行“yarn install”或“npm install”
就是這樣
TA貢獻1845條經驗 獲得超8個贊
如果您已經存在沒有模板的反應項目，則另一種解決方法：
轉到文件夾index.html中的文件public并在其中添加<script>標簽，您可以使用以下方式service worker從<script>標簽中注冊index.html：
if ("serviceWorker" in navigator) {
navigator.serviceWorker.register("/serviceworker.js")
.then(e => console.log("Service worker registered", e))
.catch(e => console.log("service worker failed", e));
}
這樣您就可以緩存您的公共圖標文件和圖像。
TA貢獻1834條經驗 獲得超8個贊
你需要運行這個命令
npx create-react-app your-app-name --template cra-template-pwa
代替
npx create-react-app your-app-name
TA貢獻1884條經驗 獲得超4個贊
運行此命令“npx create-react-app your-app-name --template cra-template-pwa”而不是“npx create-react-app your-app-name”
TA貢獻1773條經驗 獲得超3個贊
遷移全棧應用程序時，請確保執行“bukso”中的所有步驟以及：
將 serviceWorkerRegistration.js 文件添加到 src 的根目錄中，就像 service-worker.js 一樣
構建您的全棧應用程序，使用“npm install --globalserve”安裝靜態服務器
轉到客戶端目錄并使用“serve -s build”在靜態創建的構建文件夾上運行服務器
舉報