当前位置： 首页>后端>正文

vue-element-admin 安装教程及报错处理

后端2024-04-22 14:33:13

官网
https://panjiachen.gitee.io/vue-element-admin-site/zh/guide/

vue-element-admin 是一个后台前端解决方案，它基于 vue 和 element-ui实现。它使用了最新的前端技术栈，内置了 i18 国际化解决方案，动态路由，权限验证，提炼了典型的业务模型，提供了丰富的功能组件，它可以帮助你快速搭建企业级中后台产品原型。相信不管你的需求是什么，本项目都能帮助到你。

一、安装教程

克隆项目

git clone https://github.com/PanJiaChen/vue-element-admin.git

进入项目目录

cd vue-element-admin

安装依赖

npm install

建议不要用 cnpm 安装 会有各种诡异的bug 可以通过如下操作解决 npm 下载速度慢的问题

npm install --registry=https://registry.npmmirror.com

本地开发 启动项目

npm run dev

二、install 或者 run 报错处理

错误
npm ERR! fatal: remote error:
npm ERR! The unauthenticated git protocol on port 9418 is no longer supported.
npm ERR! Please see https://github.blog/2021-09-01-improving-git-protocol-security-github/ for more information.

原因:

  1. 由于tui-editor（富文本编辑器插件）更名造成的，现在已经更名为toast-ui/editor
    并且该插件还进行了文件名的更名以及方法名的更名

首先将 package.json 中的 tui-editor 那一行修改为 "@toast-ui/editor": “^3.1.3”,
(或者 安装toast-ui/editor,命令是：npm install --save @toast-ui/editor)

其次，打开 src/components/MarkDownEditor/index.vue 文件

删除script 中的所有 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'
  1. 将 package.json 中的 scriipts 开头这几条命令改为：
  "scripts": {
    "serve": "set NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",
    "build": "vue-cli-service build",
    
    "dev": "set NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --open",
    "build:prod": "set NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build --report",
    "build:stage": "set NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build --mode staging",
    "preview": "set NODE_OPTIONS=--openssl-legacy-provider && node build/index.js --preview",

// 后面的其他 不用改
// ... ...
}

PS： 还有错误，则尝试降低nodejs版本，如当前nodejs版本是18.x的话，降低为 16.x 或者 17.x ，
删除 工程下的 node_modules 目录，然后执行：

npm install

再执行：

npm run dev

就可以正常运行了。


https://www.xamrdz.com/backend/34a1927327.html

相关文章：