使用create-react-app遇到問題解決方案匯總


使用create-react-app時遇到Module not found問題

本來項目跑的好好地,然后install了一個axios,然后項目就掛了。 各種Module not found,路徑不對。 期初以為是可能丟包了,又重新install還是不行,根據錯誤提示一個個刪一個個重新install。 最后干脆重新建了個項目,但仍然不行。 這時候意識到了問題應該是出在create-react-app上:

根據這個猜想,清空了packge卸載了全部model,重新install才解決問題。原因我現在也還不知道什么情況會觸發這個bug,歡迎指教。

上代碼:

  1.  
    npm install rimraf -g //安裝刪除指令
  2.  
    rimraf node_modules //卸載node庫
  3.  
    npm install //重裝

 

npm WARN deprecated fsevents windows

 

更新下 使用yarn貌似會幫助跳過這個問題:

info fsevents@2.1.2: The platform "win32" is incompatible with this module.
info "fsevents@2.1.2" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents@1.2.9: The platform "win32" is incompatible with this module.
info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.

===

有需要下載了一個模板項目,安裝ui部分失敗,提示:

npm WARN deprecated fsevents@1.2.9: One of your dependencies needs to upgrade to fsevents v2: 1) Proper nodejs v10+ support 2) No more fetch
ing binaries from AWS, smaller package size
npm ERR! Unexpected end of JSON input while parsing near '...LNCxGNsOAHRWRMGoXrtcI'

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\user\AppData\Roaming\npm-cache\_logs\2019-12-06T07_31_31_687Z-debug.log

單獨提出來安裝:

$ npm install fsevents
npm ERR! code EBADPLATFORM
npm ERR! notsup Unsupported platform for fsevents@2.1.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm ERR! notsup Valid OS: darwin
npm ERR! notsup Valid Arch: any
npm ERR! notsup Actual OS: win32
npm ERR! notsup Actual Arch: x64

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\neoliu6\AppData\Roaming\npm-cache\_logs\2019-12-06T07_33_23_843Z-debug.log

原因明了了,這個包是在mac系統中的,windows沒有。查了下資料,大概是windows也不需要,不用安裝。

解決方法是,把fsevents依賴放到可選依賴中:

vi package.json

  "optionalDependencies": {
    "fsevents": "*"
  }

重新執行安裝(有個坑,需要刪除package_lock.json,否則標記會失效,所有依賴都將被安裝):

1
npm install -- no -optional

 

參考資料:

https://stackoverflow.com/questions/41570364/npm-install-not-working-in-windows#

But it says it is optional so I ran $npm install --no-optional and that error went away but I still can't install.

https://github.com/npm/npm/issues/17633

I'm seeing this today with npm 5.3.0. npm install --no-optional works IIF a package-lock.json does not exist. If the package-lock.json file exists, then the flag is ignored and all dependencies get installed.

 

3.撤換taobao源后,使用create-reat-app命令生成的app,默認package.json文件中不帶運行腳本命令如下:

(node: ver2.13.1  npm ver:6.12.1)

{
"name": "test",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-scripts": "3.3.0"
}
}

需要手動添加運行腳本代碼如下:
{
"name": "test",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-scripts": "3.3.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}

還有public,src等目錄需要自己添加,當然業務代碼需要自己編寫哦
然后才能通過npm run start 命令才能運行項目。

使用系統默認源的配置信息如下:
npm config list

npm config list
; cli configs
metrics-registry = "https://registry.npmjs.org/"
scope = ""
user-agent = "npm/6.12.1 node/v12.13.1 win32 x64"

; userconfig C:\Users\Administrator\.npmrc
cache = "c:\\tmp\\node_cache"
prefix = "c:\\tmp\\node_global"

 

如果使用taobo源,使用npm config list 查看配置信息如下:

; cli configs
metrics-registry = "https://registry.npm.taobao.org/"
scope = ""
user-agent = "npm/6.12.1 node/v12.13.1 win32 x64"

; userconfig C:\Users\Administrator\.npmrc
cache = "c:\\tmp\\node_cache"
disturl = "https://npm.taobao.org/dist"
prefix = "c:\\tmp\\node_global"
registry = "https://registry.npm.taobao.org/"

 

經過測試對比發現,現在通過create-react-app命令生成的APP,沒有原來帶小衛星轉的演示代碼,現在只有

"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-scripts": "3.3.0"

的庫及其依賴庫,可能是新版本取消原來的模板了,知道的網友請指教,謝謝。

如果生成的app是web應用程序,需要指定服務啟動端口,可以在在package.json文件中配置"scripts“項中的start修改為如下

"scripts": {
"start": "SET PORT & react-scripts start",  
   。。。。。。 

 即可改變默認服務器啟動端口。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



猜您在找 react-native-splash-screen android 啟動頁實現,以及遇到問題解決方案 create-react-app安裝出錯問題解決 create-react-app遇到的問題及解決方法 create-react-app 遇到問題 TypeError: Cannot assign to read only property 'jsx' of object '#' Git服務器安裝詳解及安裝遇到問題解決方案 跟我一起使用create-react-app腳手架搭建vw-layout解決方案 create-react-app 執行 yarn eject以后yarn start報錯解決方案 create-react-app 創建項目遇到的問題 【React】使用國內鏡像解決npx create-react-app my-app很慢的問題 使用create-react-app構建的項目(並引入react-app-polyfill做IE兼容)在開發環境下的IE瀏覽器中報錯的解決方案
 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM