前端React老項目打包caniuse-lite報錯解決思路

1、下載項目,先更新.npmrc文件:
registry=http://registry.npmmirror.com

2、安裝依賴,本地啟動,運行正常,但直接提交代碼線上打包時會報錯:

“ 未找到相關的合并請求。”

打開日志頁面,報錯信息是

Failed to minify the bundle. Error: static/js/main.94e018e0.js from
UglifyJs Invalid assignment

3、嘗試本地打包,會報錯

‘GENERATE_SOURCEMAP’ 不是內部或外部命令,也不是可運行的程序

可以先刪掉這個指令

"GENERATE_SOURCEMAP=false react-app-rewired build && cd ./build && pktool -k 包名"
// 刪掉后為:
"react-app-rewired build && cd ./build && pktool -k 包名"

繼續打包,然后報錯

Failed to minify the code from this file:
./node_modules/caniuse-lite/dist/unpacker/agents.js:8

4、刪除yarn.lock,刪除node_modules,清理緩存,用npm重新安裝,報錯依舊。

5、關鍵:打開生成的package-lock.json,查找caniuse-lite這個包,發現在browserslist包里面引用了版本"^1.0.30000792",在autoprefixer包里面引用了版本"^1.0.30000748",但實際的安裝版本是"1.0.30001621"。查caniuse-lite在npm上的歷史版本https://www.npmjs.com/package/caniuse-lite,發現這幾年雖然一直在更新,但一直只升級版本號第三位,當前最新的就是1.0.30001621。猜想這個4年前的項目基礎環境只會比當時的更老,雖然package.json中鎖死了相關的包的依賴版本(如"react-scripts": “1.1.4”),但他依賴的其他包仍然不能鎖死版本,導致部分依賴升級的比較新而不兼容

6、嘗試:查找4年前caniuse-lite的大概版本號,選一個"caniuse-lite": "1.0.30000999"進行鎖死安裝,然后再build,果然成功了。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/bicheng/14912.shtml
繁體地址,請注明出處:http://hk.pswp.cn/bicheng/14912.shtml
英文地址,請注明出處:http://en.pswp.cn/bicheng/14912.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

【Flutter】線性布局彈性布局層疊布局

🔥 本文由 程序喵正在路上 原創,CSDN首發! 💖 系列專欄:Flutter學習 🌠 首發時間:2024年5月25日 🦋 歡迎關注🖱點贊👍收藏🌟留言🐾 目…

4、PHP的xml注入漏洞(xxe)

青少年ctf&#xff1a;PHP的XXE 1、打開網頁是一個PHP版本頁面 2、CTRLf搜索xml&#xff0c;發現2.8.0版本&#xff0c;含有xml漏洞 3、bp抓包 4、使用代碼出發bug GET /simplexml_load_string.php HTTP/1.1 補充&#xff1a; <?xml version"1.0" encoding&quo…

內網穿透--Nps-自定義-上線

免責聲明:本文僅做技術交流與學習... 目錄 Nps項目: 一圖通解: 1-下載nps/npc 2-服務端啟動 訪問web網頁: 添加客戶端&#xff0c;生成密匙. 3-kali客戶端連接服務端 4-添加協議隧道. 5-kali生成后門&#xff1a; 6-kali創建監聽: Nps項目: https://github.com/ehang…

藍橋杯Web開發【模擬題一】15屆

1.動態的Tab欄 日常在使用移動端 APP 或訪問 PC 端網站的時候&#xff0c;常常發現在一些有工具欄或者 Tab 欄的頁面會有頂欄固定的效果。簡單來說&#xff0c;在頁面未開始滾動時頂欄處在其原有的位置上&#xff0c;當頁面向下滾動一定區域后&#xff0c;頂欄會跟隨滾動固定在…

HTTPS證書——網站如何實現HTTPS訪問?

實現網站HTTPS訪問可以簡化為以下四個基本步驟&#xff0c;確保過程既通俗易懂又條理清晰&#xff1a; 1. 申請SSL證書 - 目的&#xff1a;SSL證書是實現HTTPS加密的關鍵&#xff0c;它驗證了網站的身份&#xff0c;并提供了加密數據所需的密鑰。 - 操作&#xff1a;首先&…

超鏈接的魅力:HTML中的 `<a>` 標簽全方位探索!

&#x1f310;超鏈接的魅力&#xff1a;HTML中的 標簽全方位探索&#xff01; &#x1f3de;?基礎營地&#xff1a;認識 <a> 標簽&#x1f6e0;?基本語法&#x1f4da;屬性擴展 &#x1f680;實戰演練&#xff1a;超鏈接的多樣玩法&#x1f308;內鏈與外鏈&#x1f4c…

TypeScript(持續更新中...)

1.TypeScript是什么&#xff1f; TypeScript是javaScript的超集。 2.使用TypeScript 1&#xff09;全局安裝nodejs 2&#xff09;安裝TypeScript編譯器 npm i -g typescript 3.編譯ts文件 //注意&#xff1a;需要在ts文件同級目錄執行此命令&#xff0c;否則會報找不到…

遙感、GIS和GPS技術在水文、氣象、災害、生態、環境及衛生等領域中的應用

【科研必備】遙感、GIS和GPS技術在水文、氣象、災害、生態、環境及衛生等領域中的應用 (qq.com)https://mp.weixin.qq.com/s?__bizMzg2NDYxNjMyNA&mid2247565057&idx4&snecec1f5396132122acf02b188f7b74ac&chksmce6515eaf9129cfc9a6c4a16413c0d746003cc192132…

PostgreSQL 教程

## PostgreSQL 教程 ### 1. PostgreSQL 概述 PostgreSQL 是一個開源的對象關系型數據庫管理系統&#xff08;ORDBMS&#xff09;&#xff0c;以其高擴展性和合規性聞名&#xff0c;支持 SQL 和 JSON 查詢。 ### 2. 安裝與配置 - **下載與安裝**&#xff1a;從 PostgreSQL 官方…

C++ Primer Plus第十七章復習題

1、iostream文件在CI/O中扮演這種角色&#xff1f; 答&#xff1a; iostream文件定義了用于管理輸入和輸出的類、常量和操縱符,這些對象管理用于處理I/O的流和緩沖區。該文件還創建了一些標準對象(cin、cout、cerr和 clog以及對應的寬字符對象)&#xff0c;用于處理與每個程序…

【論文筆記】| 微調LLM晶體生成

【論文筆記】| 微調LLM晶體生成 Fine-Tuned Language Models Generate Stable Inorganic Materials as Text NYU, ICLR 2024 Theme&#xff1a;Material Generation Main work&#xff1a; 微調大型語言模型以生成穩定的材料 可靠性&#xff1a;在樣本結構中&#xff0c;90% …

如何修改WordPress網站的域名

我的網站用的是Hostease的虛擬主機&#xff0c;但是域名是之前在其他平臺買的&#xff0c;而且已經快到期了&#xff0c;因為主機和域名在不同的平臺上&#xff0c;管理不太方便&#xff0c;所以我又在Hostease重新注冊了一個域名&#xff0c;然后把網站換成了新的域名&#xf…

(Java企業 / 公司項目)配置Linux網絡-導入虛擬機

公司給了我一個IP地址 &#xff0c;提供了一個虛擬機或者自己搭建虛擬機&#xff0c;還有提供登錄的賬號密碼 可以查看我之前的文章 VMware Workstation Pro 17虛擬機超級詳細搭建&#xff08;含redis&#xff0c;nacos&#xff0c;docker, rabbitmq&#xff0c;sentinel&…

Oracle數據庫中的PCTUSED解析

PCTUSED是Oracle數據庫中與數據塊空間管理相關的另一個參數&#xff0c;它與PCTFREE共同作用于表空間的段管理。PCTUSED定義了一個數據塊中空閑空間的比例&#xff0c;低于這個比例時&#xff0c;塊被視為“足夠空閑”&#xff0c;可以再次用于插入新的數據行。其主要作用是提高…

3D透視圖模型轉模型變形?---模大獅模型網

3D建模是數字藝術和設計領域中的重要技術&#xff0c;它可以為我們帶來豐富多彩的視覺體驗和創意表達。在本文中&#xff0c;我們將探討一個引人注目的話題&#xff1a;3D透視圖中模型轉換是否會導致變形?通過深入探討這個問題&#xff0c;我們希望能夠幫助您更好地理解在3D建…

GitHub的原理及應用詳解(四)

本系列文章簡介&#xff1a; GitHub是一個基于Git版本控制系統的代碼托管平臺&#xff0c;為開發者提供了一個方便的協作和版本管理的工具。它廣泛應用于軟件開發項目中&#xff0c;包括但不限于代碼托管、協作開發、版本控制、錯誤追蹤、持續集成等方面。 GitHub的原理可以簡單…

【C++風云錄】數字邏輯設計優化:電子設計自動化與集成電路

集成電路設計&#xff1a;打開知識的大門 前言 本文將詳細介紹關于數字芯片設計&#xff0c;電子設計格式解析&#xff0c;集成電路設計工具&#xff0c;硬件描述語言分析&#xff0c;電路驗證以及電路優化六個主題的深入研究與實踐。每一部分都包含了主題的概述&#xff0c;…

如何通過軟件SPI讀寫W25Q64

STM32F1之SPI通信軟件SPI代碼編寫-CSDN博客 目錄 1. W25Qxx系列簡介 2. W25Q64硬件電路 3. W25Q64框圖 4. Flash操作注意事項 5. 代碼編寫 5.1 初始化 5.2 W25Q64讀取ID號 5.3 W25Q64寫使能 5.4 W25Q64等待忙 5.5 W25Q64頁編程 5.6 W25Q64扇區擦除&#x…

WebRTC | 網絡傳輸協議 RTP 和 RTCP

WebRTC | 網絡傳輸協議 RTP 和 RTCP WebRTC | 網絡傳輸協議 RTP 和 RTCP如何選擇 TCP 與 UDPRTP概述工作機制報文結構RTP 的使用RTP 拓展頭RTP 中的填充數據翻譯器和混合器同步控制報文大小wireshark 抓取 RTP 報文 RTCP概述工作機制分組類型報文結構WebRTC 的反饋報文RTPFBPSF…

深入淺出遞歸算法

文章目錄 遞歸思想遞歸的題目1.漢諾塔問題問題分析代碼展示 2.合并兩個有序鏈表問題分析代碼展示 3.反轉鏈表問題分析代碼展示 4.兩兩交換 鏈表中的節點問題分析代碼展示 總結 遞歸思想 遞歸就是將一個很大的問題拆分成子問題&#xff0c;然后再將子問題繼續拆分&#xff0c;拆…