各种文档
| 名称 | 链接 | 备注 |
|---|---|---|
| Vue.js 3 | https://staging-cn.vuejs.org/ | 不要看旧的 |
| Vite | https://cn.vitejs.dev/ | 不要看旧的 |
| Web开发技术 | https://developer.mozilla.org/zh-CN/docs/Web | 面向 Web 开发者的文档 |
| Pinia | https://pinia.vuejs.org/ | The Vue Store that you will enjoy using |
| Vue Router | https://router.vuejs.org/zh/ | Vue.js 的官方路由 |
| Vue.js challenges | https://cn-vuejs-challenges.netlify.app/ | Vue.js 挑战集合 |
| pinia-shared-state | https://github.com/wobsoriano/pinia-shared-state | Pinia夸标签页同步 |
| electron-vite | https://github.com/alex8088/electron-vite | 用Vite构建Electron应用 |
| Chrome媒体参与度 | chrome://media-engagement/ | 决策是否可以自动播放音频或视频 |
| tsdown | https://tsdown.dev/ | 使用Rolldown的JavaScript库打包工具 |
CSS 相关
| 名称 | 链接 | 备注 |
|---|---|---|
| css-border特效 | https://blog.csdn.net/qq_39370934/article/details/118439096 | css边框特效 |
可能有用的库
可能有用的组件
| 名称 | 链接 | 备注 |
|---|---|---|
| Chart.js | https://www.chartjs.org/ | 图表 |
| wangEditor 5 | https://www.wangeditor.com/ | 开源 Web 富文本编辑器,开箱即用,配置简单 |
| Monaco | https://microsoft.github.io/monaco-editor/ | VS Code 样式的代码编辑器 |
| shiki-magic-move | https://shiki-magic-move.netlify.app/ | 代码动效 |
| LogicFlow | https://site.logic-flow.cn/ | 流程图 |
| ByteMD | https://github.com/bytedance/bytemd | 字节跳动 Markdown 编辑器 |
| sweetalert2 | https://sweetalert2.github.io/ | 弹窗组件 |
| Textbus | https://textbus.io/ | 富文本多人协作编辑器 |
| canvas-editor | https://github.com/Hufe921/canvas-editor | 富文本编辑器 |
| UEditor Plus | https://github.com/modstart-lib/ueditor-plus | 富文本编辑器 |
| OrgChart | https://github.com/dabeng/OrgChart | 树状图 |
| Swiper | https://swiperjs.com/ | 触摸滑块 |
Vue组件
| 名称 | 链接 | 备注 |
|---|---|---|
| VueDraggablePlus | https://alfred-skyblue.github.io/vue-draggable-plus/ | 支持 Vue2 和 Vue3 的拖拽组件 |
| NES Vue | https://taiyuuki.gitee.io/nes-vue-docs/zh/ | 用于Vue 3的NES模拟器组件 |
| vue-office | https://501351981.github.io/vue-office/examples/docs/ | 更易用的文件预览 |
| vis-network | https://github.com/visjs/vis-network | 网络图可视化 |
| VueHook Plus | https://inhiblabcore.github.io/docs/hooks/ | 工具类 |
| Vue Text Highlight | https://github.com/AlbertLucianto/vue-text-highlight | 文本高亮 |
| Vue Slicksort | https://vue-slicksort.netlify.app/ | 拖拽排序 |
| Vue3 DnD | https://www.vue3-dnd.com/ | 拖拽组件 |
| Vue Flow | https://vueflow.dev/ | Vue 3 流程图组件 |
| Flowchart | https://github.com/joyceworks/flowchart-vue | 流程图组件 |
| Vxe Table | https://vxetable.cn/ | 表格 |
| Vue3 BaiduMap Gl | https://github.com/yue1123/vue3-baidu-map-gl | 百度地图 |
| Vue Json Pretty | https://github.com/leezng/vue-json-pretty | JSON展示 |
| Vue Starport | https://github.com/antfu/vue-starport | 跨路由动画 |
| VueRequest | https://www.attojs.com/ | Vue 请求库 |
| VueWordCloud | https://github.com/SeregPie/VueWordCloud | 词云 |
| vue-renderer-markdown | https://github.com/Simon-He95/vue-markdown-render | MarkDown 渲染 |
React组件
| 名称 | 链接 | 备注 |
|---|---|---|
| Sonner | https://sonner.emilkowal.ski/ | Toast 组件 |
| 头像 | Avvvatars | https://github.com/nusu/avvvatars |
| 富文本编辑器 | Plate | https://platejs.org/ |
| 流程图 | React Flow | https://reactflow.dev/ |
| Toast | React Hot Toast | https://react-hot-toast.com/ |
组件库
| 名称 | 链接 | 备注 |
|---|---|---|
| Fomantic-UI | https://fomantic-ui.com/ | A community fork of Semantic-UI |
| TOAST UI | https://ui.toast.com/ | 数据展示类组件库 |
| shadcn/ui | https://ui.shadcn.com/ | Tailwind CSS 组件库 |
| daisyUI | https://daisyui.com/ | Tailwind CSS 组件库 |
| Inspira UI | https://inspira-ui.com/ | Tailwind CSS 组件库 |
| Preline UI | https://preline.co/index.html | |
| windows-ui | https://github.com/virtualvivek/windows-ui | Fluent UI |
Vue组件库
| 名称 | 链接 | 备注 |
|---|---|---|
| Naïve UI | https://www.naiveui.com/zh-CN/ | 一个 Vue 3 组件库 |
| Vexip UI | https://www.vexipui.com/zh-CN | 一个 Vue 3 组件库 |
| Element Plus | https://element-plus.org/zh-CN/ | 一个 Vue 3 组件库 |
| Varlet | https://varlet.gitee.io/varlet-ui/ | Vue 3 Material Design 3 组件库 |
| Yike Design | https://www.huohuo90.com:3005/ | Vue 组件库 |
| made with vue.js | https://madewithvuejs.com/ | Vue 组件库合集 |
| Vue Data UI | https://vue-data-ui.graphieros.com/ | Vue 3 数据可视化组件库 |
| Im Design | https://github.com/tongmingwang/im-design |
React组件库
| 名称 | 链接 | 备注 |
|---|---|---|
| Arco Desaign | https://arco.design/ | 字节跳动 |
| Chakra UI | https://chakra-ui.com/ | 一个 React 组件库 |
| Radix UI | https://www.radix-ui.com/ | |
| Magic UI | https://magicui.design/ | React 组件库 |
| Aceternity UI | https://ui.aceternity.com/ | React 组件库 |
| Hero UI | https://www.heroui.com/ | React 组件库 |
| React Bits | https://reactbits.dev/ | 动效组件 |
| Easyui | https://easyui.io/ |
图标库
| 名称 | 链接 | 备注 |
|---|---|---|
| Simple Icons | https://simpleicons.org/?q=apacheecharts | SVG 图标库 |
| iconiFy.DESiGN | https://icon-sets.iconify.design/ | SVG 图标库 |
| LottieFiles | https://lottiefiles.com/ | 动画库 |
| Vue Unicons | https://antonreshetov.github.io/vue-unicons/ | Vue 图标库 |
| Font Awesome | https://fontawesome.com/ | 图标库 |
| Flaticon | https://www.flaticon.com/ | - |
| Remix Icon | https://remixicon.com/ |
技术笔记
工具
| 名称 | 链接 | 备注 |
|---|---|---|
| JavaScript框架语法特性对比 | https://component-party.dev/ | - |
| UI Lib Picker | https://ui-libs.vercel.app/ | Vue3 Nuxt3 UI库介绍 |
| CSS Diner | https://flukeout.github.io/ | CSS选择器练习 |
| CSS Grid Garden | https://cssgridgarden.com/ | CSS Grid练习 |
| CSS Grid Generator | https://cssgrid-generator.netlify.app/ | CSS Grid生成 |
| Flexbox Froggy | https://flexboxfroggy.com/ | Flexbox练习 |
| Can I use | https://caniuse.com/ | 浏览器兼容性查询 |
| JSRobot | https://www.jsrobot.net/ | JavaScript练习 |
| Animations | https://css-animations.io/ | CSS动画练习 |
| Flat UI Colors | https://flatuicolors.com/ | 配色参考 |
| transition.css | https://www.transition.style/ | CSS动画库 |
| 响应式应用工具 | Responsively App | https://responsively.app/ |
| 字号对比 | Typescale | https://typescale.com/ |
| Fancy Border Radius Generator | https://9elements.github.io/fancy-border-radius | border-radius值可视化生成 |
| 新拟物CSS生成 | Neumorphism.io | https://neumorphism.io/ |
| shadcn/ui主题设计工具 | tweakcn | https://tweakcn.com/ |