【farris-vue安装步骤】
farris-vue安装步骤farris-vue1 本地运行项目1.1 环境检查1.2 pnpm安装与配置1.3 获取源代码1.4 运行站点文档2 使用farris-vue2.1 安装farris/ui-vue2.2 在应用中引入Farris Vue2.3 在应用中使用Farris Vuefarris-vuefarris-vue是一套基于Farris Design 的 Vue3 组件库。farris的含义是Fast、Reliable、Responsive、Intuitive、Smart。下面将介绍如何在本地运行项目和使用farris-vue。如若有本文描述不清晰的地方可以前往farris-vue查看更多细节。1 本地运行项目1.1 环境检查在本地运行项目需要使用到node和pnpm项目要求使用Node.js v18pnpm版本为v9。可通过以下命令检查版本node -vpnpm -v1.2 pnpm安装与配置其中pnpm可以通过以下命令安装可指定版本默认最新版本npm install -g pnpm版本号例如安装7.0.0版本npm install -g pnpm7.0.0安装完成后配置taobao镜像pnpm congif set registry https://registry.npmmirror.com配置pnpm全局安装路径pnpm config set global-dir D:\pnpm\global配置pnpm全局bin文件安装路径pnpm config set global-bin-dir D:\pnpm\global-bin配置pnpm cache路径pnpm config set cache-dir D:\pnpm\cache配置pnpm state路径pnpm config set state-dir D:\pnpm\state配置pnpm store路径pnpm config set state-dir D:\pnpm\store1.3 获取源代码git clone https://gitee.com/ubml/farris-vue.git cd farris-vue pnpm install运行效果如下图可能遇到的问题可以通过执行pnpm approve-buildspnpm会列出所有待批准的依赖使用空格勾选按回车确认。建议全选按a全选然后回车。之后重新执行pnpm install。1.4 运行站点文档pnpm --filter ui-vue run docs:dev在浏览器中访问http://localhost:5173/查看示例页面。注作者按照源码地址的README.md继续运行后续可视化设计器示例和UI组件示例时出现打开网页为空白的情况以为是端口冲突的问题尝试解决后未果。目前还尚未能解决如果有大佬知道如何解决请帮帮我2 使用farris-vue下面将展示使用npm安装farris-vue的流程如果需要使用pnpm或yarn安装请查看源代码README.md。2.1 安装farris/ui-vue在vue项目下执行npm安装命令npm install farris/ui-vue成功后如图所示2.2 在应用中引入Farris Vue在main.ts文件中引入farris/ui-vue:import { createApp } from vue import App from ./App.vue import Farris from farris/ui-vue; import farris/ui-vue/index.css; createApp(App).use(Farris).mount(#app)2.3 在应用中使用Farris Vue在App.vue中添加Farris Vue组件template div f-button stylemargin: 5px 主要按钮 /f-button f-button stylemargin: 5px :typedanger 危险按钮 /f-button f-button stylemargin: 5px :typesuccess 成功按钮 /f-button f-button stylemargin: 5px :typewarning 警告按钮 /f-button f-button stylemargin: 5px :typesecondary 信息按钮 /f-button f-button stylemargin: 5px :typelink 文本按钮 /f-button /div /template效果如下图所示至此完成farris-vue的安装与使用方法。后续如果需要更多的使用说明可在本地farris vue目录下执行指令运行farris vue文档进行查阅指令如下pnpm --filter ui-vue run docs:dev2026-07-28