在前几篇文章当中,之前使用的是 Vue2,在某一天发现若依提供了 Vue3 的版本,所以这篇文章主要是运行起来,Vue2,迟早要被替代,所以这里采用最先进的 Vue3。

仓库地址:https://github.com/yangzongzhuan/RuoYi-Vue3/tree/v3.8.3

!> 注意点:以下相关的环境,需要按照如下指定的版本,否则会出现问题。运行不起来。

  • NodeJS 版本 >= 14
# 克隆项目
git clone https://github.com/yangzongzhuan/RuoYi-Vue3.git # 进入项目目录
cd RuoYi-Vue3 # 安装依赖
yarn --registry=https://registry.npmmirror.com # 启动服务
yarn dev # 构建测试环境 yarn build:stage
# 构建生产环境 yarn build:prod
# 前端访问地址 http://localhost:80

安装 yarn

npm install -g yarn

重复的事情博主这里不做,所以在我之前的 Vue2 版本已经改造过一次前端所以这里再去参考前者即可。

文档链接:https://www.cnblogs.com/BNTang/p/17484266.html

如下图这一步不需要进行:

若依后台管理系统 替换为 tienchin健身后台管理系统

TienChin 运行 RuoYi-Vue3的更多相关文章

  1. Vue3系列2--项目目录介绍及运行项目

    1 Vite项目目录 用Vscode打开创建的项目,看到下面的目录结构: 通过运行  npm install 初始化项目后生成两个初始化文件:node_modules和 package-lock.js ...

  2. 预计2019年发布的Vue3.0到底有什么不一样的地方?

    摘要: Vue 3.0预览. 原文:预计今年发布的Vue3.0到底有什么不一样的地方? 作者:小肆 微信公众号:技术放肆聊 Fundebug经授权转载,版权归原作者所有. 还有几个月距离 vue2 的 ...

  3. 纯小白入手 vue3.0 CLI - 2.7 - 组件之间的数据流

    vue3.0 CLI 真小白一步一步入手全教程系列:https://www.cnblogs.com/ndos/category/1295752.html 尽量把纷繁的知识,肢解重组成为可以堆砌的知识. ...

  4. VUE3.0升级与配置(跨域、全局scss变量等)

    1.检查本机vue版本 vue -V 2.升级vue3.0命令 npm install -g @vue/cli 3.创建完项目后,在项目根目录新增vue.config.js文件,插入代码(简洁) mo ...

  5. 使用vue3.0和element实现后台管理模板

    通过自己所学的这段时间,利用空余时间,使用vue3.0脚手架搭建的一个关于后台的管理模板,所实现功能也是模仿一个后台的界面,数据分为两种存放,一种是直接存储到mlab,这里的数据是存放这登录注册,只有 ...

  6. 如何启动一个Vue3.x项目

    1. 安装node.js 2. cd到项目目录下 3. npm run serve Node.js下载与安装(npm) Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运 ...

  7. 纯小白入手 vue3.0 CLI - 2.6 - 组件的复用

    vue3.0 CLI 真小白一步一步入手全教程系列:https://www.cnblogs.com/ndos/category/1295752.html 我的 github 地址 - vue3.0St ...

  8. Vue3.0脚手架搭建

    https://www.jianshu.com/p/fbcad30031c2 vue3.0官网:https://cli.vuejs.org/zh/guide/ 介绍: notice: 这份文档是对应 ...

  9. 创建vue3项目

    最近准备做一个vue的小项目关于vue3的使用. 首先在vscode全局安装vue脚手架,npm i -g @vue/cli. 然后创建vue项目,vue create mydemo(项目名). 接下 ...

  10. Vue3.0结合bootstrap做多页面应用(1)创建项目

    本人主要做c# winform应用,刚接触vue,发现用vue做单页面应用的比较多,多页面的资料很少,特别是用vue3.0版本做多页面的资料,更少,所以自己整理一下,结合bootstrap和jquer ...

随机推荐

  1. 使用 Kubeadm 部署 Kubernetes(K8S) 安装 -- 持久化存储(PV&PVC)

    使用 Kubeadm 部署 Kubernetes(K8S) 安装 -- Ingress-Ngnix 使用 Kubeadm 部署 Kubernetes(K8S) 安装 -- 持久化存储(NFS网络存储) ...

  2. GPT-4测评,大家先别急,图片输入还没来

    昨天GPT-4朋友圈刷屏,我更新了一篇小文章,极简罗列GPT-4的一些情报: 1 ChatGPT Plus用户才可试用GPT-4 2 试用阶段每四小时最多100条信息 3 知识库还是2021年 4 上 ...

  3. SE11/SE16N修改表数据

    1.SE11修改方法 首先修改显示格式 选择SE16标准列表 双击这条数据 输入/H,回车,再回车 修改CODE为EDIT,F8 此时,数据已经可以修改了 2.SE16N修改方法 2.1断点修改 输入 ...

  4. VIM 入门手册, (VS Code)

    要想在VScode里使用Vim需要先行按照插件 安装 vim 插件 VS Code 中输入快捷键 shift + ctrl + x, 或直接打开 扩展安装导航 搜索 vim, 选择 Vim , 点击 ...

  5. <vue 路由 7、导航守卫>

    导航守卫 一.     知识点 1.什么是导航守卫? (1)vue-router提供的导航守卫主要用来监听路由的进入和离开. (2)vue-router提供了beforeEach和afterEach的 ...

  6. freeswitch的mod_xml_cdr模块

    概述 freeswitch是一款简单好用的VOIP开源软交换平台. 在语音呼叫的过程中,话单是重要的计价和结算依据,话单的产生需要稳定可靠,可回溯. fs中的mod_xml_cdr模块提供了基本话单功 ...

  7. hello world 的并发实现

    本篇文章将介绍 hello world 的并发实现,其中涉及到的知识有: 并发与并行 GPM 调度系统 并发与并行 并发不是并行.并发是同时管理很多事情,这些事情可能只做了一半就被暂停做别的事情了.而 ...

  8. SpringBoot中使用LocalDateTime踩坑记录

    .markdown-body { line-height: 1.75; font-weight: 400; font-size: 16px; overflow-x: hidden; color: rg ...

  9. 18-CMOS门电路

    CMOS门电路 TTL是三极管构成的门电路,逐步被CMOS电路替代.CMOS电路能耗低.集成度高. CMOS反相器 CMOS管是由PMOS和NMOS组成,这里用的都是使用的增强型. COMS能够正常工 ...

  10. 【CubeMX】使用 CubeMX 生成对应的配置代码需要设置 “User Label”

    如要生成 SPI 的管脚配置代码,需要设置 User Label,这样工具才能知道应该配置什么,否则不会生成