使用Harry过程中FAQ(问题解答)

使用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/;
}