tag typescript

標籤
貢獻206
328
05:15 PM · Oct 25 ,2025

@typescript / 博客 RSS 訂閱

易墨 - 02.前後端分離中台框架前端 admin.ui.plus 學習-介紹與簡單使用

中台框架前台項目 admin.ui.plus 的初識 基於 vue3.x + CompositionAPI setup 語法糖 + typescript + vite + element plus + vue-router-next + pinia 技術,內置支持一鍵生成微服務接口,適配手機、平板、pc 的後台權限管理框架,希望減少工作量,幫助大家實現快速開發。 框架一覽

vue.js , 前後端分離 , 中台概念 , typescript , 前端

收藏 評論

zaoying - useResource聲明式API與useMock基於依賴注入的mock工具

前不久組內的萌新用不知道從哪裏學來的技術,説要封裝一套 axios 庫供大家使用。 等他開發完,在 code review 環節,大家看到他寫的代碼都面面相覷,不知道該如何評價。 我一時間也不知道該如何評價,只能提醒他不要寫死代碼,目前 axios 還沒入選開源庫,後期有可能換成其他替代品。 會後我專門到網上搜一番,發現二次封裝 axios 的案例確實不少,但給我感覺其實都半斤八兩,不見得哪個更優

mock , fetch , Axios , typescript

收藏 評論

MarkGuan - 基於vue3+ts5+vue-router4+pinia2的PC端項目搭建教程

導語:在日常開發中,有時候會在項目中引入 ts 來解決一些 js 的問題,下面就簡單介紹一下如何使用 vue3+ts+router+pinia 來搭建一個項目。 目錄 簡介 創建 安裝 配置 實戰 簡介 vue3 目前是常用的 vue 版本,提供了組合式 API 以及一些新的功能和特性;ts 這種類型編程語言可以在編譯時通過靜態分析檢測出很多常見錯誤,減少了生產環境中的運行時錯誤,改

前端構建 , vue-router4 , vuejs3 , typescript

收藏 評論

劉lhf - React Router V6項目中的路由鑑權封裝實踐(Hooks)

React Router V6項目中的路由鑑權封裝實踐(Hooks) 1. 前言 1.1 路由封裝的好處 路由鑑權集中管理: 封裝路由組件允許你集中管理路由鑑權邏輯。這意味着在一個地方處理用户是否有權限訪問某個路由,而不是在每個頁面或組件中重複相同的鑑權邏輯。這有助於保持一致性,並簡化了對路由鑑權的維護和更新。 提高代碼複用性: 封裝路由組件可以促進代碼的複用。你可以將通用的路由配置、鑑權邏

react , 封裝 , react-router , typescript , 前端

收藏 評論

perkz - Redux

Redux類適用所有React生態項目 import { applyMiddleware, combineReducers, legacy_createStore as createStore, Store, compose, } from "redux"; import thunk from "redux-thunk"; import {connect,

react , redux-thunk , redux , typescript

收藏 評論

註銷 - 關於 PWA url 參數 ngsw-bypass=true

"ngsw-bypass-true" 這個參數是與 Angular Service Worker (ngsw) 相關的一個選項,用於控制在 Service Worker 中是否繞過緩存,直接請求網絡資源。在 Angular 應用中,Service Worker 主要負責緩存應用的靜態資源,以提高應用的性能和用户體驗。 首先,讓我們瞭解一下 Angular Service Worker 的基本概念。

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

收藏 評論

愚者 - 基於tiptap一次封裝CustomEditor

tiptap一次封裝自定義UI 效果圖 (參考element-tiptap): demo如下 本次封裝基於vue3 template div v-if="editor" :class="[ { 'el-tiptap-editor': true, 'el-tiptap-editor--fullscreen': isFullscreen

vue.js , less , typescript , 前端

收藏 評論

好奇de悟空 - vscode 如何支持 css-module 文件跳轉到類名?

背景 css module 是目前主流的 css 模塊化的解決方案。使用 css module 之後,我們可以將 css 類當作模塊變量引入到我們的 typescript (下述使用 "ts" 代指)文件中來作為樣式的引用。過去,由於 ts 無法識別 css module 中導出的變量,我們使用 css 模塊變量需要到 css 文件中找到對應的類名,再寫到 ts 文件中使用,容易出錯且影響了開發效

less , visual-studio-code , postcss , typescript , 前端

收藏 評論

熱飯班長 - TypeScript新增接口和更新接口傳參定義差異的問題

interface User { id?: string; name: string; age: number; } // 新增用户時,id不是必須的,name和age必須,如何給data定義呢? export const addUser = (data: User) = fetch('/api/user/add', { method: 'POST', body:

Ajax , typescript , 前端

收藏 評論

熱飯班長 - 如何在vscode中調試typescript?

前置知識 首先要知道vsocde是無法調試typesript的。所以我們要做的就是將typescript編譯為javascript,然後告訴vscode編譯後的代碼位置,這樣才能進行調試。 流程 1 在項目根目錄創建launch.json配置 // package.json { "name": "debug-ts", "version": "1.0.0", "description"

visual-studio-code , debugging , typescript , Javascript

收藏 評論

天涯學館 - 前端安全:XSS攻擊與防禦策略

XSS(Cross-Site Scripting)攻擊是前端安全中的一個重要問題,它發生在攻擊者能夠注入惡意腳本到網頁中,這些腳本在用户瀏覽器中執行時可以獲取用户的敏感信息,例如會話令牌、個人信息等。防禦XSS攻擊通常涉及以下幾個策略: 1. 輸入驗證: 對用户提交的數據進行嚴格的驗證,確保只有預期的字符和格式被接受。 使用正則表達式或預定義的白名單模式來過濾無效字符。 限制字符串長度以防

xss , typescript , 前端 , Javascript

收藏 評論

天涯學館 - Prettier與ESLint:代碼風格與質量的自動化保證

Prettier 和 ESLint 是兩個互補的工具,它們共同確保代碼的風格一致性和質量。Prettier 負責格式化代碼,而 ESLint 則執行更復雜的靜態分析和規則檢查。 Prettier 作用: 自動化代碼格式化,確保代碼的縮進、括號、引號、換行等樣式一致。 不需要配置太多的規則,因為Prettier有一套默認的代碼風格。 支持多種編程語言,包括JavaScript、TypeS

eslint , prettier , typescript , 前端 , Javascript

收藏 評論

愛米 - 使用惰性函數優化頁面滾動事件的性能

我們在做前端開發的時候,曾遇到一些非常炫酷的宣傳頁。例如每一個蘋果產品的主頁面。我們會發現,這樣炫酷的頁面,總是跟隨我們鼠標滾輪的操作,在頁面中響應不同的事件。 一、瀏覽器的不同 我們都知道,需要在前端頁面中監聽到鼠標滾輪的事件,不同瀏覽器內核提供的方法是不同的。所以,每當我們需要監聽鼠標滾輪事件,就需要先判斷使用終端是用的什麼瀏覽器。 在前端,我們可以通過window.navigator.us

函數 , 惰性求值 , typescript , 前端 , Javascript

收藏 評論

42 - 前端 - 封裝一個通用的接口請求工具

在前端開發中,接口請求是一個非常基本的需求。幾乎每個項目都會針對自己的使用場景對接口請求操作進行一系列封裝。今天我們也來一步步封裝一個通用的請求工具。 使用效果 首先讓我們來看看封裝完後的使用效果吧。 首先我們將提供一個 defineApi 函數,用於定義接口的配置信息,包括 url,請求參數以及返回類型等,具體使用方法如下: const BASE_URL = 'https://example.c

rxjs , 接口 , typescript , 前端 , Javascript

收藏 評論

得鹿夢魚 - eslint報錯:ESLint: Unexpected empty method 'default

eslint報錯:ESLint: Unexpected empty method 'default 禁止出現空函數 (no-empty-function) 錯誤代碼示例: const props = defineProps({ data: { type: Object, default: () = {} // 報錯 Unexpected empty method 'defa

eslint , typescript , 前端 , Javascript

收藏 評論

熱飯班長 - chrome插件實現監聽ajax請求,然後修改請求參數

1 修改manifast.json manifest_version必須為3,因為這個declarativeNetRequest是3中新增的api { "manifest_version": 3, "permissions": ["declarativeNetRequest"], "host_permissions": ["all_urls"] } 2 在background.j

chrome-extension , typescript , 前端 , html5 , Javascript

收藏 評論

泯瀧 - 「譯」如何寫出更好的Typescript代碼

鏈接:https://medium.com/@technicadil_001/how-to-write-better-types... 作者:Debabrata Dash 原標題:How to write better Typescript codes? 在本文中,我們將討論大約 15 個編寫更好的 Typescript 代碼的技巧。 譯者:本文討論了 15 個實用技巧,以幫助開發者編

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

收藏 評論

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

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

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

收藏 評論

夢想雲圖網頁CAD - (WEB在線編輯DWG)在線CAD中實現測量圓、測量面積的方法

一、前言 本章將介紹如何利用mxcad插件實現在CAD圖紙中測量圓和測量面積的功能,用户點擊目標圓對象將自動標記出這個圓的半徑、面積值和周長值,同時可以自定義選擇標註文字的位置,測量圓功能能夠快速掌握目標圓對象的數據信息,方便統計工程量。 測量面積功能(多邊形、矩形)以多邊形的每一個頂點來確定多邊形的形狀和位置,通過點擊矩形的量角點來確定矩形的大小和位置,也可以自定義標註文字的位置。 二、測

ecmascript-6 , typescript , HTML , html5 , Javascript

收藏 評論

huqi - 跟魯迅重學 TypeScript | (五)異步處理、axios與封裝axios

“不在沉默中爆發,就在沉默中滅亡”,面對日益嚴峻的國際環境,我們祖國母親沒有繼續沉默,9月25日8時44分,洲際彈道導彈精準發射。,看到這個新聞,腰也不酸了,腿也不疼了,一口上上五樓,TS 學起來更帶勁了~ 異步處理 在 TypeScript 中,異步編程如同現代社會中的種種現象,紛繁複雜,令人眼花繚亂。而 async/await 正如那一柄利劍,能將這混沌的世界理清,使得程序員不至於深陷於回調的

Axios , typescript , Javascript

收藏 評論

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

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

ast , typescript , babel , 前端 , Javascript

收藏 評論

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

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

ecmascript-6 , typescript , 前端 , Javascript

收藏 評論

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

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

ecmascript-6 , typescript , 前端 , Javascript

收藏 評論

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

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

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

收藏 評論