通用表單解決方案---皮影
皮影為不同框架提供統一的表單開發體驗 使開發者更加關注於邏輯和佈局,從瑣碎事物中解放出來 皮影的相關設置更加語義化,減少開發心智;並允許自定義封裝 皮影完全兼容valibot的所有Action,可以完美的利用其驗證及轉換機制 文檔 感性的認識可能會讓您更快的體驗到皮影的魅力,網站上實現了大量的用例,方便您快速瞭解皮影 https://piying-org.github.io/we
Nickname wszgrcy
@typescript
Contributes82
Followers0
Contributes
@typescript
Stories List
我開源了一個表單庫 - 元數據定義一次,即可渲染
我查看了市面上所有的表單庫,都有一個致命的缺點,定義多次才能實現表單 比如,像下面的代碼(偽代碼) interface Test { firstName: string; } const form = useFormTest({ defaultValues: { firstName: "default", }, onSubmit: async ({ value }
Nickname wszgrcy
基於vue3+ts5+vue-router4+pinia2的PC端項目搭建教程
導語：在日常開發中，有時候會在項目中引入 ts 來解決一些 js 的問題，下面就簡單介紹一下如何使用 vue3+ts+router+pinia 來搭建一個項目。 目錄 簡介 創建 安裝 配置 實戰 簡介 vue3 目前是常用的 vue 版本，提供了組合式 API 以及一些新的功能和特性；ts 這種類型編程語言可以在編譯時通過靜態分析檢測出很多常見錯誤，減少了生產環境中的運行時錯誤，改
Nickname MarkGuan
View UI Plus 發佈 1.3.1 版本，增強 TypeScript 使用體驗
View UI Plus 1.3.1 版本已於 2022-06-29 發佈。 更新日誌 請到官網 www.iviewui.com 查看最新版。 提供基於 TypeScript 的工程。view-ui-project-ts Playground 默認模板支持切換組合式 API 和選項式 API。Playground 修復 ImagePreview 操作欄在移動端顯示不完整的問題。#104
Nickname Aresn
Vue 3 + TypeScript + Element Plus + Vite 4.3：實現一個優雅的登錄註冊功能
先附上源碼地址： 覺得不錯的話順手一個star 效果展示 最新vite搭建項目 npm create vite@latest mingsl-login -- --template vue-ts 配置tsconfig tsconfig.node.json { "compilerOptions": { "composite": true, "skipLibCheck": true,
Nickname imhaoli168
02.前後端分離中台框架前端 admin.ui.plus 學習-介紹與簡單使用
中台框架前台項目 admin.ui.plus 的初識 基於 vue3.x + CompositionAPI setup 語法糖 + typescript + vite + element plus + vue-router-next + pinia 技術，內置支持一鍵生成微服務接口，適配手機、平板、pc 的後台權限管理框架，希望減少工作量，幫助大家實現快速開發。 框架一覽
Nickname 易墨
dom-vcr - 使用 HTML5 canvas 和 SVG 從 DOM 節點生成視頻或 GIF
📦 安裝 npm i dom-vcr 🦄 使用 錄製 2s 生成 4 幀 GIF 需要安裝 gif.js import { createVcr } from 'dom-vcr' import GIF from 'gif.js' const dom = document.querySelector('#app') const vcr = createVcr(dom, { interv
Nickname weng
[Angular]單運行時多項目共享依賴方案
ngx-center 一箇中心,多個...... 使用介紹(視頻) 這是什麼? 一個 Angular 單運行時多項目共享依賴的解決方案 只啓動一個 Angular 平台(PlatformRef),其他子項目進行導出(類 es6 module),通過資源文件清單(或單獨 js 文件)進行請求加載 功能 支持子項目在開發時代碼變更的刷新 支持子項目調用主項目導出的命名(e
Nickname wszgrcy
微信weixin-js-sdk.d.ts
第一步：安裝weixin-js-sdk npm install weixin-js-sdk --save 第二步：新增對應的.d.ts 在項目目錄下新增 src/model/weixin-js-sdk.d.ts (好用記得回來給我點贊) declare namespace WeixinJsSdk { /** ************************************
@yuanliangwoyishengbufanggegaowenyi
Nickname 原諒我一生不羈放歌搞文藝
基於tiptap一次封裝CustomEditor
tiptap一次封裝自定義UI 效果圖 （參考element-tiptap）： demo如下 本次封裝基於vue3 template div v-if="editor" :class="[ { 'el-tiptap-editor': true, 'el-tiptap-editor--fullscreen': isFullscreen
Nickname 愚者
vscode 如何支持 css-module 文件跳轉到類名？
背景 css module 是目前主流的 css 模塊化的解決方案。使用 css module 之後，我們可以將 css 類當作模塊變量引入到我們的 typescript （下述使用 "ts" 代指）文件中來作為樣式的引用。過去，由於 ts 無法識別 css module 中導出的變量，我們使用 css 模塊變量需要到 css 文件中找到對應的類名，再寫到 ts 文件中使用，容易出錯且影響了開發效
Nickname 好奇de悟空
react-router-middleware-plus開源啦 | 基於react-router v6的零成本式路由權限解決方案
一、你的苦惱~~ 你還在為react-router的路由權限控制而煩惱嗎？ 你還在翻遍了社區react路由權限相關文章發現都是V4、V5版本的而煩惱嗎？ 你還在為自行適配react-router v6版本的權限步驟繁雜，多重鑑權邏輯嵌套而煩惱嗎？ 他來了！他來了！他帶着禮物走來了！react-router-middleware-plus專為解決你的煩惱而生！ 二、react-router-midd
Nickname 胡哥有話説
React Router V6項目中的路由鑑權封裝實踐（Hooks）
React Router V6項目中的路由鑑權封裝實踐（Hooks） 1. 前言 1.1 路由封裝的好處 路由鑑權集中管理： 封裝路由組件允許你集中管理路由鑑權邏輯。這意味着在一個地方處理用户是否有權限訪問某個路由，而不是在每個頁面或組件中重複相同的鑑權邏輯。這有助於保持一致性，並簡化了對路由鑑權的維護和更新。 提高代碼複用性： 封裝路由組件可以促進代碼的複用。你可以將通用的路由配置、鑑權邏
Nickname 劉lhf
【擁抱鴻蒙】HarmonyOS之構建一個自定義彈框
彈窗是一種模態窗口，通常用來展示用户當前需要的或用户必須關注的信息或操作。在UI開發中，彈框是重要且不可忽視的組件。 HarmonyOS內置了多種系統彈框，分別有AlertDialog 、TextPickerDialog 、DatePickerDialog以及TimePickerDialog等。 本文將詳細介紹系統彈框的封裝和使用，並着重展現自定義彈框的實現。 系統彈框
Nickname 鄭知魚
MetisUI-一套企業級 React-Tailwind 組件庫
Metis UI 的目標是為那些喜歡 Ant Design 的開發者提供一個更靈活的選擇，特別是希望結合 Tailwind CSS 的開發者。我們在保留 Ant Design 組件設計邏輯的基礎上，提供了以下改進： 樣式覆蓋更靈活基於 Tailwind CSS 的樣式體系，開發者可以方便地對組件的各個元素進行樣式覆蓋，無需編寫複雜的自定義樣式，快速實現個性化設計。 增強的交互功能內置了一些
Nickname Ming
jest +ts +esm
Jest 是當下最主流的前端測試框架 首先初始化ts環境 yarn add typescript --dev npx tsc --init 第二步:安裝ts下的jest yarn add jest @types/jest --dev 第三步:新建tests文件夾 tests/index.spec.ts it('init',()={ expect(true).toB
Nickname ohoherror
偏愛console.log的你，肯定會覺得這個插件泰褲辣！
前言 毋庸置疑，要説前端調試代碼用的最多的，肯定是console.log，雖然我現在 debugger 用的比較多，但對於生產環境、小程序真機調試，還是需要用到 log 來查看變量值，比如我下午遇到個場景：選擇完客户後返回頁面，根據條件判斷是否彈窗： if (global.isXXX || !this.customerId || !this.skuList.length) return // 到
Nickname 暴走
通過 AST 實現組件庫替換升級
年初接到一個任務將 semi-ui 替換到 antd，但是能人力預算不太夠，所以基於工作量和效率選擇了基於 AST 的替換方案。 項目技術棧是 React + tsx 為什麼要使用 AST？ AST（Abstract Syntax Tree，抽象語法樹）是一種在計算機科學中表示源代碼語法結構的樹狀數據結構。 通過 AST，可以理解代碼的結構和含義，實現代碼分析、轉換和操作。 基於 AS
Nickname linong
robot-admin 一個現代化的基於業務場景的中後台解決方案
我做了個 Vue3 的中後台框架，想和你聊聊背後的故事 不是技術博客，只是一個前端開發者的自白 開篇 你好，我是 CHENY。一個有點代碼潔癖的前端開發者。 今天想和你聊聊我最近做的一個開源項目 —— Robot Admin。不聊技術有多牛，不聊架構有多先進，就想和你説説，為什麼要做這個項目，以及它能幫你解決什麼問題。 為什麼又是一個後台框架？ 是的，我知道。GitHub 上的後台框架已經夠多了
Nickname ChenyCHENYU
AXUI v3.1.27震撼發佈：全新Viewer媒體查看器模塊和Toast短消息模塊
更新內容 修復Range組件使用reset方法無效的問題。 將 Range 庫的參數從 aixs 改為 flow，可選值為 h/v（水平/垂直） 修復Datetime組件在手機端下拉年份和月份高度不正確的問題的。 修復Select組件的工具箱顏色問題 修復Search組件，使用shape屬性時報錯的問題。 修復Search組件，使用s
Nickname AXUI
HTTP代理：網絡世界的智能中轉站
在互聯網信息高速流動的時代，HTTP代理作為一種基礎卻強大的網絡工具，正在各類網絡活動中扮演着越來越重要的角色。它就像一位經驗豐富的網絡嚮導，不僅能夠優化訪問路徑，還能在用户與目標網站之間建立起安全屏障，讓網絡體驗更加流暢和安全。 HTTP代理最基本的功能是作為網絡請求的中轉站。當用户通過代理訪問網站時，請求首先發送到代理服務器，再由代理服務器向目標網站獲取數據。這種間接訪問的方式帶來了多重優勢：
Nickname 細心的手套
分享8款研發團隊協作常用軟件
Coding管理工具是一款集開發協作、代碼託管、項目管理、持續集成與自動化部署為一體的企業級雲平台，旨在為開發團隊提供一站式的開發與運維解決方案。該平台整合了敏捷項目管理、代碼版本控制和自動化構建流程，幫助企業實現數字化轉型，提高協同效率，並確保項目從開發到上線的全流程無縫連接。Coding管理工具主要功能包括Git代碼託管、項目任務管理、問題追蹤、持續集成與自動化部署以及團隊協作與文檔管理。平台
Nickname 奔放的炒粉
用 rollup + gulp 造個輪子，別説還挺香
前戲 我是16年入了前端的坑，17年知道了gulp和rollup這兩個玩意兒。由於那時webpack勢頭很猛，便一直沒有正眼瞧過它一眼。 直到20年進了一家小公司，做了很多類似的小項目，相同的代碼拷來拷去，出現一個bug一堆項目都要改，實在噁心到我了。 於是不得不開始考慮將一些公共的方法和組件提取出來，做成一個第三方庫來維護。而在庫的封裝方面，rollup相對於webpack具有一定的優勢。 在此
Nickname 末日碼農
提升開發體驗：基於 JSDoc 的 React 項目自動代碼提示方案詳解
需求背景 主管和其他同事基於公司的業務特點，開發了一套自研前端框架。技術選型是 React + JavaScript 的組合，上線後表現還不錯。現在他們想把這個組件庫推廣到其他團隊使用，所以讓我琢磨一下：怎麼能讓使用者用得更順手一點？尤其是能不能在寫代碼的時候有自動提示？ 我調研了一下市面上常見的幾種方案，大致有以下幾類： 把整個項目從 JavaScript 重構為 TypeScript，這樣
Nickname 一顆冰淇淋