使用Harry過程中FAQ(問題解答)
- Harry-Vue 啓動報錯信息
- Cannot find module錯誤信息
- Harry-Vue 的路由在nginx中刷新出現404
一.Harry-Vue 啓動報錯信息
mac下執行 npm install 報錯信息:
No receipt for 'com.apple.pkg.CLTools_Executables' found at '/'.
No receipt for 'com.apple.pkg.DeveloperToolsCLILeo' found at '/'.
No receipt for 'com.apple.pkg.DeveloperToolsCLI' found at '/'.
gyp: No Xcode or CLT version detected!
gyp ERR! configure error
gyp ERR! stack Error: `gyp` failed with exit code: 1
gyp ERR! stack at ChildProcess.onCpExit (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:351:16)
gyp ERR! stack at ChildProcess.emit (events.js:198:13)
gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:248:12)
gyp ERR! System Darwin 19.4.0
gyp ERR! command "/usr/local/bin/node" "/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild"
gyp ERR! cwd /Users/honghh/Downloads/harry-vue/node_modules/fsevents
gyp ERR! node -v v10.16.0
gyp ERR! node-gyp -v v5.0.5
gyp ERR! not ok
解決方案:
嘗試用如下命令進行修復
xcode-select --install
系統提示如下信息：
xcode-select: error: command line tools are already installed, use "Software Update" to install updates
而事實上並沒有所謂的"Software Update"可以更新
正確姿勢 一籌莫展之際，找到如下解決方案：
sudo rm -rf /Library/Developer/CommandLineTools
xcode-select --install
二. Cannot find module錯誤信息
在項目中harry-vue/src/store/modules目錄下配置文件permission.js中有這樣一段代碼:
export const loadView = (view) => { // 路由懶加載
return () => import(`@/views/${view}`)
}
但是很多人運行後報以下錯誤:
Error: Cannot find module '@/views/system/user/index'
at webpackEmptyContext (index.js:39)
at permission.js:73
然後將其改成以下代碼就可以正常訪問了
export const loadView = (view) => { // 路由懶加載
return (resolve) => require([`@/views/${view}`],resolve)
}
import和require的區別
node編程中最重要的思想就是模塊化，import和require都是被模塊化所使用。
遵循規範
- require 是AMD規範引入方式
- import是es6的一個語法標準，如果要兼容瀏覽器的話必須轉化成es5的語法
調用時間
- require是運行時調用，所以require理論上可以運用在代碼的任何地方
- import是編譯時調用，所以必須放在文件開頭
本質
- require是賦值過程，其實require的結果就是對象、數字、字符串、函數等，再把require的結果賦值給某個變量
- import是解構過程，但是目前所有的引擎都還沒有實現import，我們在node中使用babel支持ES6，也僅僅是將ES6轉碼爲ES5再執行，import語法會被轉碼爲require
三.Harry-Vue 的路由在nginx中刷新出現404
修改nginx配置文件，配置文件爲conf下的nginx.conf,修改nginx.conf中的server配置片段
location / {
#需要指向下面的@router否則會出現vue的路由在nginx中刷新出現404
try_files $uri $uri/ @router;
index index.html index.htm;
}
#對應上面的@router，主要原因是路由的路徑資源並不是一個真實的路徑，所以無法找到具體的文件
#因此需要rewrite到index.html中，然後交給路由在處理請求資源
location @router {
rewrite ^.*$ /index.html last;
}
location /prod-api/ {
proxy_pass http://localhost:9001/;
}