Code Monkey home page Code Monkey logo

qingqingxuan / arco-work Goto Github PK

View Code? Open in Web Editor NEW
191.0 6.0 37.0 4.49 MB

🎉🎉🎉Arco Work,漂亮、强大、完善。采用 Vue3 Vite5 TypeScript Arco-Design编写的中后台框架。全面的系统配置,优质模板,常用组件,真正一站式开箱即用🎉🎉🎉

Home Page: http://arco.vueadminwork.com

License: MIT License

JavaScript 5.55% CSS 0.86% HTML 0.24% TypeScript 14.82% Vue 77.49% Less 1.05%
arco-design arco-work vue-admin pinia vue-router4 vue3 typescript vite

arco-work's Introduction

MIT License Vue3.0 Live Demo

Arco Work

简介:

Arco Work,是 Vue Admini Work 系列中最成熟和完善的中后台框架,全面的系统配置,优质模板,常用组件,真正一站式开箱即用 采用时下最流行的 Vue3 UI 库--ArcoDesign

使用了当今最流行的技术框架: Vue3 + Vite5 + TypeScript + ArcoDesign + Pinia

特性:

  • 常用模板
    • 内置常用模板,无需考虑交互排版,助你高效开发
  • 预设样式
    • 样式美观大方,无缝对接 Naive Ui,随意组合页面,随心所欲
  • 布局方案
    • 丰富的布局模式,具有高可配性,满足您的各类布局需求
  • 技术支持
    • 优质的售后技术支持,完善的文档,让您事半功倍
  • 最新技术栈
    • 基于 Vue3、Vite2、TypeScript、NaiveUI、Pinia 等最新技术栈开发
  • 轻量快速的热重载
    • 无论应用程序大小如何,都始终极快的模块热重载(HMR)
  • 丰富的示例
    • 常见的 Web 端插件示例实现
  • 组件封装
    • 对日常使用频率较高的组件二次封装,满足基础工作需求
  • 主题配置
    • 丰富的主题配置及黑暗主题适配
  • 权限管理
    • 完善的前后端权限管理方案

项目地址:

Vue Admin Work 系列中其它开源项目的演示地址

请关注我们的微信公众号 知码前端 ,里面包含了各个版本的源码和进入微信福利群的方式

适合人群

  • 正在以及想使用 vue/arco design 开发,最好是有一定的编程知识,或者原来只从事切图写静态页的人想提高自己的前端能力。
  • 熟悉 Vue.js 技术栈,使用它开发过几个实际项目。
  • 对原理技术感兴趣,想进阶和提升的同学。

下载&安装

  • 下载

    git clone -b master https://github.com/qingqingxuan/arco-work.git
  • 进入项目目录

    cd arco-work
  • 安装依赖

    npm install
  • 运行

    npm run dev

如何贡献

非常欢迎你的加入!提一个 Issue 或者提交一个 Pull Request。

Pull Request:

  1. Fork 代码!
  2. 创建自己的分支: git checkout -b feat/xxxx
  3. 提交你的修改: git commit -am 'feat(function): add xxxxx'
  4. 推送您的分支: git push origin feat/xxxx
  5. 提交pull request

Git 贡献提交规范

  • 参考 vue 规范 (Angular)

    • feat 增加新功能
    • fix 修复问题/BUG
    • style 代码风格相关无影响运行结果的
    • perf 优化/性能提升
    • refactor 重构
    • revert 撤销修改
    • test 测试相关
    • docs 文档/注释
    • chore 依赖更新/脚手架配置修改等
    • workflow 工作流改进
    • ci 持续集成
    • types 类型定义文件更改
    • wip 开发中

浏览器支持

本地开发推荐使用Chrome 80+ 浏览器

支持现代浏览器, 不支持 IE

 Edge
IE
 Edge
Edge
Firefox
Firefox
Chrome
Chrome
Safari
Safari
not support last 2 versions last 2 versions last 2 versions last 2 versions

特别感谢

🚀 vue3.x
🚀 naive-ui
🚀 vue-router-next
🚀 pinia
🚀 axios
🚀 mockjs
🚀 echarts

优势及注意事项

arco-work 有如下优势:
1. 支持前端控制路由权限和后端控制路由模式
2. 支持 mock ,完全独立于后台
3. 内置了大量常用的组件,比如,上传,消息提示等
4. 支持多主题、多布局切换
使用注意事项:
1. 项目默认使用使用vscode工具进行开发,也是唯一推荐的开发工具
2. 项目默认eslint校验规范

arco-work's People

Contributors

qingqingxuan avatar qqxliufeng avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

arco-work's Issues

多语言支持

hi,这个框架真的很棒,想请教作者未来有计划支持多语言国际化吗?

新拉下来的项目不能正常运行


项目依赖缺少lodash
add package: pnpm add lodash

项目依赖缺失
位置:src\store\plugin\persist.ts
报错:import { isObject } from '@vue/shared'
-- 找不到模块“@vue/shared”或其相应的类型声明。
fix: 删除 import { isObject } from '@vue/shared'

add: 增加以下代码在文件中
const opt = Object.prototype.toString

export function isObject(obj: any): obj is { [key: string]: any } {
return opt.call(obj) === "[object Object]"
}

位置:src\components\PasswordStrong.vue
报错:import { reactive } from '@vue/reactivity'
--找不到模块“@vue/reactivity”或其相应的类型声明。
fix: 删除import { reactive } from '@vue/reactivity'
在下一行增加import { watch, ref, reactive } from 'vue'

其它地方如果@VUE报错,也是类似方法

cacheable 的页面异常

比如项目演示的可拖拽页面,点击其他页面后返回,页面就假死了,无法拖拽,其他所有的cacheable的页面都有类似问题

关于跨域的问题

感谢作者的开源,我在vite.config.js设置了:
server: {
proxy: {
// 选项写法
‘/api‘: {
target: ‘http://jsonplaceholder.typicode.com‘,
changeOrigin: true,
rewrite: (path) => path.replace(/^/api/, ‘‘),
},
},
},
也在axios.config.ts设置了export const baseURL ='http://192.168.2.103:8080/'
但没有解决 ,信息如下:
Access to XMLHttpRequest at 'http://192.168.2.103:8080/api/rpc/sp_login' from origin 'http://127.0.0.1:5173' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header contains multiple values 'http://127.0.0.1:5173, http://127.0.0.1:5173', but only one is allowed.
axios.config.ts:58 Error: Network Error
at createError (createError.js:16:15)
at XMLHttpRequest.handleError (xhr.js:117:14)
xhr.js:210 POST http://192.168.2.103:8080/api/rpc/sp_login net::ERR_FAILED 200

请作者指教

左侧 menu 交互卡顿

版本:线上示例
环境:Chrome 111.0.5563.147
描述:点击收缩 menu 后,menu 的展开与关闭卡顿严重。具体参考下方 performance,存在大量丢帧情况
image

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.