貢獻者508
粉絲0
gulp是什麼？ 一個基於node的前端自動化任務構建工具，使用經典回調+鏈式調用的方式實現任務的自動化 (src.pipe(...).pipe)，gulp其實和webpack很相似，但是gulp側重點不同，gulp更側重前端流程自動化、任務執行（通過任務使開發提效），就像一條流水線。而webpack則是更側重用於打包前端資源，一切皆可打包成模塊。 官方文檔：https://www.gulp
昵稱 洛陽醉長安行
前戲 我是16年入了前端的坑，17年知道了gulp和rollup這兩個玩意兒。由於那時webpack勢頭很猛，便一直沒有正眼瞧過它一眼。 直到20年進了一家小公司，做了很多類似的小項目，相同的代碼拷來拷去，出現一個bug一堆項目都要改，實在噁心到我了。 於是不得不開始考慮將一些公共的方法和組件提取出來，做成一個第三方庫來維護。而在庫的封裝方面，rollup相對於webpack具有一定的優勢。 在此
昵稱 末日碼農
gulp 是一個使用“流”來實現自動化的工具，正如 官方文檔 首頁展示的這副動圖一樣，以“流動”的狀態去處理 TypeScript、PNG、Markdown 資源。 與webpack比較 類別 webpack gulp 核心理念 module bundler task runner 執行任務 模塊化
昵稱 一顆冰淇淋
gulp 一般用於處理自動化任務，默認情況無法處理模塊化，也不會用於大型項目，但它可以使用各種插件來編譯 html、css、js 等資源。 不清楚如何使用 gulp 開啓任務的朋友可以參考 gulp使用指南 處理html 處理 html 資源使用到 gulp-htmlmin 這個插件，和 webpack中使用到的html-webpack-plugin 比較相似。 // gulpfile.js co
昵稱 一顆冰淇淋
使用 CRXJS 構建 Chrome 插件在 Chrome 瀏覽器升級到 130xxx 版本之後，出現 Content Security Policy 錯誤 一、前言 之前有個老哥找我寫了插件，到現在幾個月過去了，今天早上和我説 Chrome 瀏覽器報錯運行不起來了，但是 edge 瀏覽器沒問題。 就幫忙定位了下問題，發現是 Content Security Policy 的問題導致的報錯； 老
昵稱 月恆
本文總結: 文章主要介紹了 React Native 的新架構，包括以下幾個方面的內容：📱✨ 如何抹平 iOS 和 Android 樣式差異，提升跨平台一致性； 分析了舊架構中存在的問題，如通信瓶頸、啓動慢、維護複雜等； 介紹了 JSI 中間層 帶來的變革，如： 不再強依賴 JavaScriptCore 引擎； 可直接在 JS 層調用 Native 方法，提升交互效率； 講解了 R
昵稱 溪抱魚
React Router V7 本身並沒有直接提供內置的路由守衞 API（比如 Vue Router 的 beforeEach），但通過組合其提供的鈎子（如 useNavigate、useLocation）和 React 的組件設計模式，我們可以實現類似的功能，比如權限控制、登錄驗證、數據預加載等場景。 路由守衞 路由守衞是指在路由切換時執行一些邏輯，以決定是否允許導航到目標路由。 常見的場景包括
昵稱 Aion
前言 2020年外賣最火熱的時候，有一篇文章《外賣騎手，困在系統裏》。 作為一個互聯網從業人員，我之前從未有機會體會到，當每一個工作都要被時間和算法壓榨時，我會是一種怎樣的感受。 而最近的一段經歷，我感覺也被困在系統裏了。 起因 如果你是一個研發人員，免不了要值班、處理線上問題。當然這都很正常，每個系統都有bug或者諮詢類的問題。 由於我們面臨的客户比較多，加上系統有一些易用性的問題或bu
昵稱 幸福的鬧鐘
簡介 腳手架CLI(command-line-interface)是一類快速形成工程化目錄的工具。 開發過程中，如果需要新建前端項目，我們經常都會用到腳手架來創建工程，通過命令行式的交互，可快速選擇選項並完成初始項目的搭建。而CV大法往往會帶來很多重複的刪減工作，且會導致項目分散、架構不統一等等弊端。 常見的主流框架都有自己的腳手架： create-vite @vue/cli create
昵稱 小皇帝James
走過路過不要錯過，只説一遍，真的很好用，不好用你可以在評論裏面噴我、踩我 uniapp插件地址（https://ext.dcloud.net.cn/plugin?id=15196） 一套代碼打包多個微信小程序 一套代碼打包多個抖音小程序 簡介 此項目是用來免除手動替換小程序appid的煩惱。有些公司會在開發環境是一個appid，測試，準生產，生產又是另一個appid，避免我們每次手動填寫，打包構建
昵稱 浪跡天涯小king
@Observed裝飾器和@ObjectLink裝飾器：嵌套類對象屬性變化 概述 @ObjectLink和@Observed類裝飾器用於在涉及嵌套對象或數組的場景中進行雙向數據同步： 被@Observed裝飾的類，可以被觀察到屬性的變化； 子組件中@ObjectLink裝飾器裝飾的狀態變量用於接收@Observed裝飾的類的實例，和父組件中對應的狀態變量建立雙向數據綁定。這個實例可以是數組中
昵稱 相見
作為 JavaScript 開發者，我們經常忘記並不是所有人都像我們一樣瞭解 JavaScript，這被稱為知識的詛咒：當我們精通某個內容的時候，我們就不記得自己作為新人的時候有多麼困惑。我們總是對其他人的能力估計過高，因此我們覺得，自己寫的類庫需要一些 JavaScript 代碼去初始化和配置也很正常。然而，一些用户卻在使用過程中大費周折，他們瘋狂地從文檔中複製粘貼例子並隨機組合這些代碼，直到它
昵稱 Apifox
前端工程化實踐中，Monorepo（單倉庫）管理和Lerna是兩種流行的方式，用於大型項目或組件庫的組織和版本管理。 Monorepo簡介 Monorepo（單倉庫）是指在一個Git倉庫中管理多個相關項目的開發方式。這種方式的優點在於： 集中式管理：所有項目都在一個倉庫中，方便代碼共享、版本同步和協同開發。 模塊化：可以創建獨立的模塊，方便複用和維護。 統一的CI/CD：一次配置，全倉
昵稱 天涯學館
在日常的前端開發中，我們常常藉助各種基於 Node.js 的腳手架工具來加速項目搭建和維護，比如 create-react-app 可以一鍵初始化一個 React 項目，eslint 則幫助我們保持代碼的整潔和一致。而在公司內部，為了更好地滿足特定業務的需求，我們往往會構建自己的腳手架工具，如自定義的 React 或 Vue 框架、內部使用的代碼檢查工具等。本篇文章來和大家分享一下如何用 Node
昵稱 一顆冰淇淋
寫在最前 本故事簡要地介紹了 Monorepo 的 What 和 Why，重點篇幅在於搭建一個好用的 Monorepo 工程時應該考慮的點。可以作為你在選擇工具時的條件，也可以作為你在搭建 Monorepo 工程時查漏補缺的參考。希望這對你有所幫助，哪怕只是一點點 ^O^ “在這個 AI 內容生成氾濫的時代，依然有一批人"傻傻"堅持原創，如果您能讀到最後，還請點贊或收藏或關注支持下我唄，感謝 (￣
昵稱 蛋先生DX
在日常的前端開發工作中，我們經常依賴各種命令行工具來提高效率和代碼質量。例如，create-react-app 和 eslint 等工具不僅簡化了項目的初始化過程，還能自動執行代碼檢查和格式化任務。當我們使用這些工具時，它們通常會通過一系列互動式的問答來收集必要的信息，從而根據我們的選擇進行相應的配置和安裝。 以 eslint 工具為例（如下圖所示），當你首次運行 eslint --init 命令
昵稱 一顆冰淇淋
隨着項目規模的增長和模塊化需求的增強，MonoRepo（單一代碼庫）的管理方式正在成為熱門選擇。本文將帶領你瞭解 MonoRepo 的形成背景，探討主流解決方案（如 pnpm workspaces、TurboRepo、Nx 和 Rush），並通過對比分析這些工具的優劣與適用場景，最終幫助你選擇最適合的工具。 MonoRepo 的形成背景 隨着項目複雜度和團隊規模的擴大，傳統的單體代碼庫或多代碼庫（
昵稱 Sean
需求背景 主管和其他同事基於公司的業務特點，開發了一套自研前端框架。技術選型是 React + JavaScript 的組合，上線後表現還不錯。現在他們想把這個組件庫推廣到其他團隊使用，所以讓我琢磨一下：怎麼能讓使用者用得更順手一點？尤其是能不能在寫代碼的時候有自動提示？ 我調研了一下市面上常見的幾種方案，大致有以下幾類： 把整個項目從 JavaScript 重構為 TypeScript，這樣
昵稱 一顆冰淇淋
一、前言 在現代前端應用中，日誌回撈系統是排查線上問題的重要工具。然而，傳統的日誌系統往往面臨着包體積過大、存儲無限膨脹、性能影響用户體驗等問題。本文將深入分析我們在@dw/log和@dw/log-upload兩個庫中實施的關鍵性能優化，以及改造過程中遇到的技術難點和解決方案。 核心優化策略概覽： 我們的優化策略主要圍繞三個核心問題： 存儲膨脹問題 - 通過智能清理策略控制本地存儲大小 包體
昵稱 得物技術
我們知道 Promise 一旦實例化之後，狀態就只能由 Pending 轉變為 Rejected 或者 Fulfilled， 本身是不可以取消已經實例化之後的 Promise 了。 但是我們可以通過一些其他的手段來實現終止 Promise 的繼續執行來模擬 Promise 取消的效果。 Promise.race 我們都知道 Promise.race 方法接收多個 Promise ，一旦這些 Pro
昵稱 前端蛋卷
雖然Promise是開發過程中使用非常頻繁的一個技術點，但是它的一些細節可能很多人都沒有去關注過。我們都知道，.then, .catch, .finally都可以鏈式調用，其本質上是因為返回了一個新的Promise實例，而這些Promise實例現在的狀態是什麼或者將來會變成什麼狀態，很多人心裏可能都沒個底。我自己也意識到了這一點，於是我通過一些代碼試驗，發現了一些共性。如果您對這塊內容還沒有把握，
昵稱 程序員白彬
我一度以為自己很懂Promise，直到前段時間嘗試去實現Promise/A+規範時，才發現自己對Promise的理解還過於淺薄。在我按照Promise/A+規範去寫具體代碼實現的過程中，我經歷了從“很懂”到“陌生”，再到“領會”的過山車式的認知轉變，對Promise有了更深刻的認識！ TL;DR：鑑於很多人不想看長文，這裏直接給出我寫的Promise/A+規範的Javascript實現。 gi
昵稱 程序員白彬
Hey, 我是 沉浸式趣談 本文首發於【沉浸式趣談】，我的個人博客 https://yaolifeng.com 也同步更新。 轉載請在文章開頭註明出處和版權信息。 如果本文對您有所幫助，請 點贊、評論、轉發，支持一下，謝謝！ 聊到異步，Promise 大家肯定都不陌生，是咱們處理異步操作的神器 不過呢，就算有 Promise，有時候處理一些既可能是同步又可能是異步的函數，或者那種隨時可
昵稱 沉浸式趣談
背景 後台系統首頁，存在各個訂單狀態的數量統計，現需要實現點擊後跳轉到對應頁面，即快速跳轉。目前系統只有一個訂單列表頁面，table上方倒是有查詢表單，可以根據不同狀態篩選數據。 初步思路 首頁通過框架路由API跳轉，攜帶參數；目標頁面初始化階段獲取參數，填入表單，發起查詢請求。 分析現有代碼 列表頁面由一個統一的Table組件封裝，Table內有查詢Form、Table等組件，通過外部傳入的查詢
昵稱 何棄療
