目录
前言
是他就是他!
项目运行后界面:
项目地址:
vue-element-adminhttps://github.com/PanJiaChen/vue-element-admin
搞了三天,error了3天真的致郁了,今晚终于解决了!希望我这篇博客可以帮到更多的人!
首先,遇到的错误有很多,比如node版本、webpack版本、npm版本、github连接等等。
如图所示是第一个遇到的错误:
网上很流行的解决办法都对我无效,我自己拼拼凑凑,汲取全网智慧的结晶,才成功跑起来,下面开始说明。
详细解决办法
1.我的是mac系统,其他系统应该也都适用。为什么直接从github下载的项目npm install一直报错呢,因为很多插件都更新了,直接根据package.json 安装会有很多版本问题。这也就是为啥问题层出不穷的原因。接下来每一步都看好啦,漏了哪一步都不行!
2.先确认你的node和npm版本:
npm -v
node -v
这是我的版本:
今天是2022.6.22 ,去官网下载node就是16的,16的都可以用,如果你不是16的版本,就去下载 | Node.jshttps://nodejs.org/zh-cn/download/下载,下载好打开压缩包傻瓜式安装,他会直接覆盖原来的,这样子你连npm也不需要重新安装指定版本:
准备好了node环境,接下来使用我提供的这个项目,当然也可以去官网下载最新的压缩包(目前是4.4.0),我试过了可以的!(你也可以继续使用你自己下载的项目,但是我不能确定能不能行,你可以试试先用你原来的):
链接: https://pan.baidu.com/s/1MFzC_5ioKVMm348B0RoPDA 密码: w4bk
解压缩在vscode打开。
VScode打开该项目目录下终端(不会有人还不知道咋开吧,右上角第二个按钮),以下操作移除项目的node_modules模块和package-lock.json,然后强制清除缓存 (不管你是不是用我提供的项目,先分别执行这三个语句,没有坏处的):
rm -rf node_modules
rm package-lock.json
npm cache clear --force
将package.json中的tui-editor那一行修改为
"@toast-ui/editor": "^3.1.3",
接下来去修改src -> components->MarkdownEditor->index.vue
进行以下操作:
(1)将开头所有import替换成下面四行:
import 'codemirror/lib/codemirror.css'
import '@toast-ui/editor/dist/toastui-editor.css'
import Editor from '@toast-ui/editor'
import defaultOptions from './default-options'
(2)把里面的getValue和setValue分别换成getMarkdown和setMarkdown,所有tui-editor全部替换为@toast-ui/editor
保存后执行npm install,使用淘宝镜像安装比较快:
npm install --registry=https://registry.npm.taobao.org
发现没有error了(有WARN是正常的现象!):
直接启动:
npm run dev
✅绿了绿了终于成功啦,感天动地。
⚠️注意事项
不要听弹幕的去用cnpm install,官方文档都说明了这个会产生很多奇怪的error。这个解决不了问题。
也不要去听弹幕的去盲目对webpack、node降级,治标不治本,会引起更多error。
感谢以下博客: