tag 前端

標籤
貢獻1,072
2900
06:37 AM · Oct 27 ,2025
tuzixiansen_63d4d65909d62 頭像 smileZAZ 頭像 qaz666 頭像 opentiny 頭像 invalidnull 頭像 dirackeeko 頭像 beishangdejianjidan_cqxuxf 頭像 yayu 頭像 junxiudetuoba 頭像 jdcdevloper 頭像 icecreamlj 頭像 xixindehongjiu 頭像

@前端 / 博客 RSS 訂閱

infinilabs 頭像

極限實驗室 - 【第4期】搜索客 Meetup | INFINI Pizza 網站 SVG 動畫這麼炫，我教你啊！

本次 Meetup 活動由 搜索客社區、極限科技（INFINI Labs）聯合舉辦，活動主題將從設計師的角度出發，探討如何在零編程基礎下，藉助 ChatGPT 和 SVG，搞定 INIFNI Pizza 首頁動效，從設計到實現，探索 AI 的更多玩法。歡迎大家預約報名參加和交流。 活動主題：INIFNI Pizza 網站 SVG 動畫這麼炫，我教你啊！ 活動時間：2024 年 9 月 25

前端 , svg

收藏 評論

liuyuxuan6666 頭像

LYX6666 - 解決lodash由於依賴錯誤導致無法啓動的問題

目錄 問題描述 嘗試的解決辦法 真正的解決辦法 結論 一、 問題描述 一個很久沒接觸的老項目，前兩天想看一下里面一個功能，結果前端起不來了。 先上報錯： Error: node_modules/@types/lodash/common/object.d.ts:1026:46 - error TS1005: '?' expected. 1026 : K extend

node.js , localstorage , typescript , npm , 前端

收藏 評論

shaogongbra 頭像

ShaoGongBra - duxapp：基於Taro使用模塊化開發，提升開發效率

duxapp是基於Taro二次開發的模塊化框架 使用這個框架，結合框架提供的UI庫和工具庫，能幫助你快速且高質量的完成項目，且能實現同時開發小程序、H5、APP（React Native），並且保證各個端的一致性 duxapp還針對APP開發（React Native）做了大量優化，大大降低了APP發開的難度，你可以閲讀React Native教程，瞭解詳情 下面讓我來詳細介紹如何使用duxapp

react , react-native , 模塊化 , taro , 前端

收藏 評論

mosong 頭像

墨鬆 - VitePress、Hexo、Docusaurus，哪個最適合你的靜態網站？

在選擇合適的靜態網站工具時，Hexo、VitePress、Docusaurus 是三個備受關注的選項，那麼到底哪一個框架更適合你呢？ 本文從使用場景、社區生態、功能、性能、擴展性這五個方面，幫你全方位分析各個框架的優缺點，以便為你的技術選型提供參考。 1、應用場景 Hexo, 官方定位自己是 "快速、簡潔且高效的博客框架" , 但是它同樣適合構建簡單的文檔網站，它具有簡單易用的特點，適合那些

vite , 網站 , 文檔 , vitepress , 前端

收藏 評論

nanchengfe 頭像

南城FE - 純CSS實現有趣emoji切換開關

這是一個純CSS創建的動畫切換開關，它不僅能夠在視覺上吸引用户，還能通過交互提供即時反饋。本文將解析源碼的核心實現邏輯，這個項目的核心是使用CSS變量、3D變換和過渡效果來實現一個動態的、響應式的用户界面元素。 關鍵技術點 CSS變量：用於動態調整樣式。 3D變換：用於創建翻轉動畫效果。 過渡效果：用於平滑地改變元素的樣式。 emoji：並不是真正的emoji而是通過CSS繪製。 實

css3 , 動畫 , Css , 前端

收藏 評論

minnanitkong 頭像

王大冶 - 使用 React Query 時還需要 Redux 嗎？| 狀態管理 2024

React Hook 深入淺出 CSS技巧與案例詳解 vue2與vue3技巧合集 VueUse源碼解讀 隨着前端技術的不斷髮展，狀態管理一直是React應用開發中的核心問題。Redux作為長期佔據主導地位的狀態管理庫，為開發者提供了可預測的狀態容器和強大的生態系統。然而，隨着React Query等新興工具的出現，開發者們開始重新思考狀態管理的最佳實踐。本文將深入探討在2024年的前

ecmascript-6 , 前端 , Javascript

收藏 評論

refanbanzhang 頭像

熱飯班長 - 給線條類型的svg圖標加上繪製的動畫效果

效果展示 步驟分解 1 確認svg文件有路徑數據 2 獲取path的長度 3 定義繪製線條的長度 4 定義關鍵幀動畫 5 應用關鍵幀動畫 實操 1 確認svg文件有路徑數據 path標籤裏面的d屬性，就是路徑數據 template svg fill="none" xmlns="http://www.w3.org/2000/svg" width="260" hei

animation , css3動畫 , keyframes , 前端 , Javascript

收藏 評論

icecreamlj 頭像

一顆冰淇淋 - 前端模塊化進化史：從全局 function 到 ES Modules

目前，前端開發已經離不開由 CommonJS、ES Modules 和 Webpack 構建的模塊化開發環境。無論是 JavaScript、CSS、圖片還是其他資源，都可以作為一個模塊來處理。那麼，模塊化究竟是如何發展到今天的呢？ 全局函數模式 最初的前端模塊化嘗試是通過 全局函數來實現的。例如，在一個 util.js 文件中定義了一個變量 count 和一個工具函數 formatNumberWi

amd , commonjs , es-modules , 前端 , Javascript

收藏 評論

linong 頭像

linong - 通過 AST 實現組件庫替換升級

年初接到一個任務將 semi-ui 替換到 antd，但是能人力預算不太夠，所以基於工作量和效率選擇了基於 AST 的替換方案。 項目技術棧是 React + tsx 為什麼要使用 AST？ AST（Abstract Syntax Tree，抽象語法樹）是一種在計算機科學中表示源代碼語法結構的樹狀數據結構。 通過 AST，可以理解代碼的結構和含義，實現代碼分析、轉換和操作。 基於 AS

ast , typescript , babel , 前端 , Javascript

收藏 評論

qzuser_juan26 頭像

juan26 - svg轉字體文件部分線條缺失

問題： ui給的svg是這樣的： 上傳到iconmoon之後轉換出來的圖標是這樣的： 可以看到中間的A字缺失了一部分 解決過程： 以為是A字識別不出來，於是在其他地方找了一個帶有A的svg，上傳到iconmoon查看轉換後的圖標是，A並沒有缺失，猜測是svg源碼的問題導致iconmmon轉換時有問題。 查看沒問題的svg源碼如下： 查看有問題的svg

前端 , svg

收藏 評論

minnanitkong 頭像

王大冶 - 如何複製由自定義元素組成的網頁的 HTML 代碼

React Hook 深入淺出 CSS技巧與案例詳解 vue2與vue3技巧合集 VueUse源碼解讀 有時我們需要獲取某個網頁HTML的本地副本,例如作為測試的輸入。 但複製網頁或元素的HTML並不總是直截了當的。現代網站往往由自定義元素構建。自定義元素通常是影子宿主。影子宿主的 innerHTML 或 outerHTML 屬性只返回直接子元素的HTML,而忽略了包含的影子DOM的

ecmascript-6 , typescript , 前端 , Javascript

收藏 評論

steven_code 頭像

Steven - browserslist 使用簡介

頁面為了能在各個品牌、各個版本的瀏覽器上正常顯示，需要處理各種兼容問題：將現代的 JavaScript 語法（ESNext）轉譯為舊版的 JavaScript 語法（ES5）；為不兼容的 CSS 樣式添加瀏覽器前綴（-webkit-、-moz-）；等等。 現代的前端頁面開發流程，都有相應的工具為開發者自動地處理這些兼容問題：Autoprefixer - 為 CSS 樣式，自動添加不兼容的瀏覽器前綴

browser , 兼容性 , 工程化 , 前端

收藏 評論

baqidenangua 頭像

圖形開發學院 - 專業URL編碼解碼工具，輕鬆處理鏈接

  圖形開發學院開發的URL編碼/解碼工具，以其直觀和靈活的操作界面，為圖形開發者提供了強有力的支持。無論是初學者還是資深專家，都能輕鬆上手，享受編碼/解碼的便捷。                   URL編碼/解碼工具界面 原文鏈接：“URL編碼/解碼”詳細介紹 - 在線工具 | 圖形開發學院 工具鏈接：URL編碼/解碼 - 在線工具 | 圖形開發學院

前端 , url

收藏 評論

gqkmiss 頭像

月恆 - 使用 CRXJS 構建 Chrome 插件在 Chrome 瀏覽器升級到 130xxx 版本之後，出現CSP錯誤

使用 CRXJS 構建 Chrome 插件在 Chrome 瀏覽器升級到 130xxx 版本之後，出現 Content Security Policy 錯誤 一、前言 之前有個老哥找我寫了插件，到現在幾個月過去了，今天早上和我説 Chrome 瀏覽器報錯運行不起來了，但是 edge 瀏覽器沒問題。 就幫忙定位了下問題，發現是 Content Security Policy 的問題導致的報錯； 老

gulp , chrome , chrome-extension , 前端

收藏 評論

judei 頭像

Judei - Element Table 表格樹形結構多選框選中子級父級狀態變為半選中狀態（遞歸多級）

1.實現效果 2.數據和佈局準備 準備一個 el-table 組件以及數據源，這裏的數據源可以是你的接口提供的。 template div style="width: 78%;" el-table ref="menuTableRef" :data="menuList" style="width: 100%;margin-bottom: 20px;" :row-class-

css3 , less , 前端 , html5 , Javascript

收藏 評論

ailvyoudemaojin 頭像

JavaCodexPro - [開源]一款可視化提效頁面生成工具

一、簡介 基於 vue3.x 可視化拖拽編輯，頁面生成工具。提升前端開發效率，可集成至移動端項目作為通過定義 JSON 直接生成 UI 界面 項目採用了 Apache 2.0 license協議 允許自由使用：你可以自由地使用受該許可證約束的軟件，用於各種目的，包括商業應用。 源代碼可用性：通常要求在分發衍生作品時，提供相應的源代碼。這有助於確保軟件的透明度和可修改性

node.js , vuex , 前端

收藏 評論

laughingzhu 頭像

LaughingZhu - 創建一個專屬的 CLI

作為一個前端，基本上每次初始化項目都會用到腳手架，通過一些腳手架可以快速的搭建一個前端的項目並集成一些所需的功能模塊，避免自己每次都手動一個一個去安裝。安裝各個包的這個過程其實沒啥營養，通過封裝一個腳手架來跳過這個步驟，把精力聚焦到功能研發上。 由於最近自己在寫項目都是相同的技術棧：Nextjs + TailwindCSS + TypeScript + ShadcnUI ，有時候如果忘記了 Sha

astro , blog , 前端 , Markdown

收藏 評論

ailvyoudemaojin 頭像

JavaCodexPro - [開源] 又一款快速開發的後台管理系統

一、簡介 這是一款ThinkPHP v8.0 和 Layui v2.9.x 的快速開發的後台管理系統 使用MIT開源協議 寬鬆性：與其他常見的軟件許可協議（如 GPL、LGPL、BSD）相比，MIT 協議相對寬鬆，賦予軟件被許可人更大的權利與更少的限制 兼容性高：對軟件的再使用限制較少，因此具有較高的兼容性，可以與其他許可協議並存，也與 GPL 兼容 商業友好：

node.js , thinkphp , 前端

收藏 評論

minnanitkong 頭像

王大冶 - React Native 0.76 重大更新：新架構全面啓用

React Hook 深入淺出 CSS技巧與案例詳解 vue2與vue3技巧合集 VueUse源碼解讀 架構升級的里程碑 React Native 0.76 版本帶來了一個重大變革 - 新架構默認啓用。這次更新不僅支持了 React 的現代特性（如 Suspense、Transitions），還徹底重寫了原生模塊系統。 核心特性升級 1. 併發渲染支持 新架構完整支持 React 的

ecmascript-6 , typescript , 前端 , Javascript

收藏 評論

minnanitkong 頭像

王大冶 - [Next.js14] NextAuth v5 (3) - Google 登錄

React Hook 深入淺出 CSS技巧與案例詳解 vue2與vue3技巧合集 VueUse源碼解讀 Google Cloud 設置 訪問 https://console.cloud.google.com/apis 如果你是第一次使用Google Cloud，請確保同意服務條款。 按照以下步驟繼續： 根據你的喜好編輯項目名稱，然後點擊"CREATE" 你將被重定向到這個界

ecmascript-6 , 前端 , Javascript

收藏 評論

hightopo 頭像

hightopo - 掌控物體運動藝術：圖撲 Easing 函數實踐應用

現如今，前端開發除了構建功能性的網站和應用程序外，還需要創建具有吸引力且尤為流暢交互的用户界面，其中動畫技術在其中發揮着至關重要的作用。在數字孿生領域，動畫的應用顯得尤為重要。數字孿生技術通過精確模擬現實世界中的對象、過程和系統，對動畫的需求遠遠超過傳統前端開發。 在這種環境中，動畫不僅僅是為了美觀，更是用於實現系統與現實的同步、演示覆雜過程和數據可視化的關鍵手段。 HT 動畫介紹 在足夠短的時間

函數式編程 , 動畫 , 可視化 , 前端 , Javascript

收藏 評論

chongdongdedaxiongmao_kxfei 頭像

chongdongdedaxiongmao_kxfei - 探索 Java 中的 Stream API：優雅處理集合的利器

Java 8 引入了一個功能強大的工具——Stream API，極大地簡化了對集合的操作。傳統上，Java 程序員習慣使用 for 循環來遍歷集合並進行過濾、映射等操作，這種方式雖然直觀但代碼冗長且難以維護。Stream API 通過流式編程的方式，使得我們能夠以更簡潔和優雅的方式操作集合。 本文將介紹 Java Stream API 的基本概念及其常見的使用場景，幫助你更好地掌握這一工具。 一、

ecmascript-6 , typescript , HTML , 前端 , Javascript

收藏 評論

dirackeeko 頭像

DiracKeeko - [axios] 版本升級，特性變更記錄(高版本post請求異常)

axios 原版本 0.19.2，升級到0.27.2 出現了部分post請求發送異常的情況。 經查發現雖然大版本號同為0，但是0.27.2的內部邏輯有變更。 (0.27.2版本去掉了一些0.19.2版本中的對config的兼容性處理)，導致0.19.2中不規範的api使用方式在0.27.2中無法生效。 問題發生在使用類似於下面這種形式發送post請求。 axios.post(ur

Axios , 前端

收藏 評論

daoshanghundesijidou 頭像

用户bPdeG32 - Vue.js：現代化前端開發的高效框架

Vue.js 是一個用於構建用户界面的漸進式 JavaScript 框架。它以其輕量、靈活和易上手的特性受到前端開發者的廣泛歡迎。Vue.js 不僅適用於小型項目的快速開發，也可以通過組件化和豐富的生態系統構建大型複雜的應用。在本文中，我們將深入瞭解 Vue.js 的核心特性，常見使用場景及其獨特的優勢。 一、什麼是 Vue.js？ Vue.js（簡稱 Vue）是由尤雨溪在 2014 年發佈的開源

vue.js , ecmascript-6 , typescript , 前端 , Javascript

收藏 評論