摘要:
@echo off set "MyChrome_NAME=MyChrome" set "MyChrome_NAME_SHORT=MyChrome" set "MyChrome_DESCRIPTION=Chrome portable launcher and updater" set "MyChrom
閱讀全文
posted @ 2025-03-24 18:25
龍陌
閱讀(35)
推薦(0)
摘要:
在前端項目打包發布后,如果需要查詢某個依賴包在打包時安裝的版本號,可以通過以下幾種方式實現。這些方法可以幫助你在發布后的環境中追溯依賴的版本信息。 方法 1: 在打包時將依賴版本寫入到構建產物中 你可以在打包過程中動態獲取依賴包的版本號,并將其嵌入到構建產物(如HTML、JavaScript文件)中
閱讀全文
posted @ 2025-03-24 16:22
龍陌
閱讀(351)
推薦(0)
摘要:
使用油猴(Tampermonkey)腳本可以實現對頁面行為的監聽與修改,包括監聽window.open事件、處理Cookie等操作。不過,直接通過這種方式在不同域名之間復制和粘貼Cookie存在一些安全性和技術上的挑戰: 同源策略:瀏覽器的安全機制限制了JavaScript訪問不同源(協議+域名+端
閱讀全文
posted @ 2025-03-22 21:33
龍陌
閱讀(152)
推薦(0)
摘要:
constants.scss $namespace: 'longmo' !default; $common-separator: '-' !default; $element-separator: '__' !default; $modifier-separator: '--' !default;
閱讀全文
posted @ 2025-03-16 23:00
龍陌
閱讀(37)
推薦(0)
摘要:
Design Tokens 是一種用于存儲和管理設計系統中視覺風格(如顏色、字體、間距等)的值的方法。 它們作為設計決策的基本單位,可以跨不同平臺和工具(包括但不限于Web、iOS、Android等)保持一致的設計語言。 Design Tokens并不是一種樣式方案,而是一種概念或方法論,它幫助設計
閱讀全文
posted @ 2025-03-16 22:23
龍陌
閱讀(143)
推薦(0)
摘要:
在前端JavaScript中,可以通過解析瀏覽器的URL中的hash部分來獲取參數。Hash部分通常以 # 開頭,后面跟著路徑和查詢參數。以下是一個示例代碼,展示如何從URL的hash部分獲取參數: JavaScript function getHashParams() { // 獲取當前URL的h
閱讀全文
posted @ 2025-03-13 19:08
龍陌
閱讀(245)
推薦(0)
摘要:
緩存 WebAssembly 模塊可以顯著提高性能,尤其是在應用中多次需要相同模塊的情況下。然而,這種做法也有其局限性和需要注意的地方。以下是緩存 WebAssembly 模塊時可能遇到的一些限制和挑戰: 1. 內存占用 限制:緩存 WebAssembly 模塊意味著在內存中保留了編譯后的 WebA
閱讀全文
posted @ 2025-03-12 21:27
龍陌
閱讀(74)
推薦(0)
摘要:
當你加載和實例化一個由C語言編譯得到的WebAssembly模塊時,importObject用于提供該WASM模塊所需的外部依賴項。這些依賴項通常包括內存、表(tables)、全局變量以及函數等。下面是一些具體的示例,展示了如何為不同的情況指定importObject。 示例 1: 提供內存 如果C
閱讀全文
posted @ 2025-03-12 21:20
龍陌
閱讀(38)
推薦(0)
摘要:
WebAssembly.instantiate 是一個用于編譯和實例化 WebAssembly 模塊的 JavaScript API。它允許你從二進制源(如 .wasm 文件的內容)創建一個可執行的 WebAssembly 實例,并且可以同時提供這個模塊所需的外部依賴(即導入對象)。下面是關于 We
閱讀全文
posted @ 2025-03-12 21:15
龍陌
閱讀(156)
推薦(0)
摘要:
WebAssembly.compile(source) 是一個用于編譯 WebAssembly 二進制代碼(通常從 .wasm 文件讀取的 ArrayBuffer)到一個 WebAssembly.Module 對象的低級 API。雖然在很多情況下,開發者可以直接使用更高級別的 WebAssembly
閱讀全文
posted @ 2025-03-12 21:13
龍陌
閱讀(64)
推薦(0)
摘要:
function calcStyle() { const el = document.querySelector(.bg-color-${instant._uid}); if (el) { el.style.maxWidth = ${defaultTooltipMaxWidth.value}px;
閱讀全文
posted @ 2025-03-09 13:31
龍陌
閱讀(33)
推薦(0)
摘要:
當你在前端使用 JavaScript 的 File 對象時遇到 Illegal invocation 錯誤,通常是因為你嘗試以不正確的方式調用了某些方法或訪問了某些屬性。這個錯誤提示表明調用的方法需要特定的上下文(即this指向),而你在調用它的時候沒有提供正確的上下文。 例如,如果你直接從 Fil
閱讀全文
posted @ 2025-03-07 15:27
龍陌
閱讀(158)
推薦(0)
摘要:
在使用 Axios 發起請求時,直接修改 Referer 頭是不可行的,這是因為 Referer 是一個 forbidden header name(禁止的頭部名稱),瀏覽器出于安全考慮不允許 JavaScript 修改這些頭部信息。 不過,你可以通過配置 Axios 的 headers 來設置其他
閱讀全文
posted @ 2025-03-06 11:38
龍陌
閱讀(589)
推薦(0)
摘要:
在 Vue Router 中,route.matched 是一個只讀的屬性,它包含了當前路由及其所有嵌套層級的路由記錄。這些記錄是根據你的路由配置和當前 URL 動態計算出來的,代表了從根路由到當前頁面路徑所經過的所有路由定義。 由于 matched 是只讀的,你不能直接修改它的內容。但是,如果你需
閱讀全文
posted @ 2025-03-04 11:30
龍陌
閱讀(158)
推薦(0)
摘要:
在 Vue 3 中,v-model 的工作機制得到了進一步的增強和優化,盡管其核心概念仍然是實現雙向數據綁定,但與 Vue 2 相比,它引入了更多靈活性和功能改進。 Vue 3 中 v-model 的本質 默認行為:在 Vue 3 中,v-model 在基礎用法上與 Vue 2 類似,依舊是在表單元
閱讀全文
posted @ 2025-02-27 23:32
龍陌
閱讀(95)
推薦(0)
摘要:
在 Vue 2 中,v-model 是一個語法糖,它簡化了在表單元素或組件上創建雙向數據綁定的過程。其本質是結合了 v-bind(綁定屬性)和 v-on(監聽事件)兩個指令的功能。 具體來說,在原生表單元素(如 <input>, <textarea> 和 <select>)上使用 v-model 時
閱讀全文
posted @ 2025-02-27 23:28
龍陌
閱讀(165)
推薦(0)
摘要:
在 Vue 3 中,watch 和 watchEffect 都是用于偵聽數據變化并執行相應的副作用(side effects),但它們之間存在一些關鍵區別: watch 顯式指定監聽的數據源:你需要明確指出要監聽的響應式數據(如 ref 或 reactive 對象的屬性)。 惰性執行:只有當被監聽的
閱讀全文
posted @ 2025-02-21 16:12
龍陌
閱讀(378)
推薦(0)
摘要:
在Vue 2項目中,特別是那些具有復雜UI結構的應用,將路由分為側邊菜單路由(sidebarRoutes)和實際添加到路由表的路由是一種常見的設計模式。這種分離主要有以下幾個原因: 權限控制:通過區分sidebarRoutes和實際路由,可以更靈活地進行權限管理。例如,可以根據用戶的權限動態生成側邊
閱讀全文
posted @ 2025-02-19 10:01
龍陌
閱讀(55)
推薦(0)
摘要:
defaultProps 是基于 vm.$options.propsData 初始化的,但實際上 propsData 通常用于傳遞給組件的實際值而非默認值。 默認值應該從 vm.$options.props 中獲取。 toRef 可以確保即使 props 發生變化,引用仍然保持一致。vue2.7是支
閱讀全文
posted @ 2025-02-18 09:22
龍陌
閱讀(20)
推薦(0)
摘要:
在 Vue 2 中,component.$options ||= {} 這行代碼的作用是確保 component.$options 存在且是一個對象。具體來說: ||= 是邏輯或賦值運算符。它的工作原理是:如果左邊的操作數(在這個例子中是 component.$options)是“假值”(如 nul
閱讀全文
posted @ 2025-02-17 10:45
龍陌
閱讀(22)
推薦(0)
摘要:
Subversion (SVN) 本身并不直接支持在檢出或更新代碼后自動執行腳本,比如運行 pnpm i。SVN 是一個版本控制系統,主要用于管理和追蹤文件的變化,并不提供類似 Git Hooks 的機制來觸發外部命令或腳本。 但是,你可以通過以下幾種方式實現 SVN 檢出或更新后的自動化任務: 方
閱讀全文
posted @ 2025-02-14 15:03
龍陌
閱讀(40)
推薦(0)
摘要:
在前端項目中,assets 目錄通常用于存放靜態資源文件。這些文件包括但不限于圖片、字體、樣式表、腳本等。為了更好地組織和管理這些資源,常常會在 assets 目錄下創建多個子目錄。盡管具體的結構可以根據項目的需要靈活調整,但以下是一個常見的分類方式: 常見的子目錄結構 images 或 img 存
閱讀全文
posted @ 2025-02-13 14:37
龍陌
閱讀(191)
推薦(0)
摘要:
在前端項目中,@xxx/shared 目錄(這里的 xxx 可能代表公司名、項目名或其他標識符)通常用于存放可以在整個項目或多個項目之間共享的代碼。這種結構有助于促進代碼重用,簡化維護,并確保不同部分或項目間的一致性。下面詳細介紹其作用、優勢及使用場景: 作用 代碼重用:將通用的功能模塊化,如工具函
閱讀全文
posted @ 2025-02-13 11:14
龍陌
閱讀(97)
推薦(0)
摘要:
在前端工程化的上下文中討論副作用(side effects)時,通常指的是那些除了返回值之外還對外部狀態或行為產生影響的操作。副作用可以包括網絡請求、DOM 操作、異步操作、直接修改全局變量等。這些操作使得函數的行為變得不可預測,增加了代碼的復雜性和測試難度。 UI組件與副作用 UI組件本身并不必然
閱讀全文
posted @ 2025-02-12 22:46
龍陌
閱讀(88)
推薦(0)
摘要:
方法變量命名相關規范 英文單詞命名規范 無論前端代碼還是后端代碼、異或其他代碼,都是由一個個單詞組成的,所以一個好的單詞影響著代碼的本身,所以我們定義如下: 合理使用正確的英文單詞 很多人認為自己英語不好就命名比較隨意,但我們看來,一個有道詞典或者百度翻譯就能看好的解決這件事情,所以單詞的命名必須使
閱讀全文
posted @ 2025-02-12 22:09
龍陌
閱讀(216)
推薦(0)
摘要:
URL.createObjectURL() 和 new FileReader()在讀取預覽文件時區別 URL.createObjectURL() MDN 靜態方法會創建一個 DOMString,其中包含一個表示參數中給出的對象的URL。 這個 URL 的生命周期和創建它的窗口中的 document
閱讀全文
posted @ 2025-02-12 21:41
龍陌
閱讀(136)
推薦(0)
摘要:
在前端項目中,libs 和 vendor 目錄通常用于組織第三方庫或依賴項,但它們的使用和定義可能因項目結構、構建工具以及團隊習慣的不同而有所差異。下面是對這兩個目錄的一般定義、作用、區別及使用場景的解釋。 Libs 目錄 定義與作用: libs 目錄通常用來存放那些不直接通過包管理器(如 npm
閱讀全文
posted @ 2025-02-12 20:44
龍陌
閱讀(201)
推薦(0)
摘要:
在Subversion (SVN) 中,確實有類似 Git 中 .gitignore 文件的功能,但使用方法和機制有所不同。SVN 使用的是 svn:ignore 屬性來指定應被忽略的文件或目錄模式。 如何設置 svn:ignore 通過命令行設置: 你可以在想要應用忽略規則的目錄下使用以下命令:
閱讀全文
posted @ 2025-02-11 09:41
龍陌
閱讀(256)
推薦(0)
摘要:
Vue.config.ignoredElements 是 Vue.js 提供的一個配置選項,用于告訴 Vue 忽略某些自定義元素。這對于使用 Web Components 或其他外部庫中的自定義元素非常有用,因為這些元素在 Vue 編譯時不會被識別為 Vue 組件,從而避免不必要的警告和錯誤。 作用
閱讀全文
posted @ 2025-02-07 22:49
龍陌
閱讀(122)
推薦(0)
摘要:
npx taze -r -w 命令是用來更新項目依賴的工具 taze 的一個使用實例。下面是對這個命令及其參數的解釋: Taze Taze 是一個現代化的依賴更新工具,旨在幫助開發者輕松地保持項目的依賴項最新。它能夠自動分析項目的依賴關系,并提出版本升級建議。Taze 特別強調安全性和穩定性,通過僅
閱讀全文
posted @ 2025-01-26 13:50
龍陌
閱讀(73)
推薦(0)
摘要:
"Internal" 這個詞在英文中的基本意思是“內部的”或“內在的”,指的是事物內部的部分,與外部相對。當這個詞應用于不同的上下文時,它的具體含義可能會有所變化。在技術和軟件開發領域,尤其是在前端工程項目中提到 "internal" 目錄或模塊時,通常有以下幾層含義: 內部使用:指該目錄下的文件或
閱讀全文
posted @ 2025-01-25 22:02
龍陌
閱讀(196)
推薦(0)
摘要:
Brotli 和 Gzip 都是用于數據壓縮的算法,旨在減少文件大小以加快網絡傳輸速度。然而,它們之間存在一些關鍵區別: 壓縮效率 Brotli:由Google開發,提供了比Gzip更高的壓縮率,尤其是在文本文件(如HTML、CSS和JavaScript)上表現尤為突出。Brotli通過使用一個預定
閱讀全文
posted @ 2025-01-25 21:44
龍陌
閱讀(500)
推薦(0)
摘要:
解釋 { "$schema": "https://json.schemastore.org/tsconfig", "display": "Web Application", "extends": "./base.json", "compilerOptions": { "jsx": "preserve
閱讀全文
posted @ 2025-01-25 21:03
龍陌
閱讀(198)
推薦(0)
摘要:
在編程術語中,# 符號通常用來表示實例方法或屬性,而 . 則用于靜態方法或屬性。然而,在 JavaScript 的官方文檔或者標準語法中,并沒有使用 # 來區分實例方法和靜態方法的習慣。 實際上,JavaScript 使用的是點符號 (.) 來訪問對象的方法和屬性,無論是靜態的還是實例的。 對于 A
閱讀全文
posted @ 2025-01-24 10:02
龍陌
閱讀(22)
推薦(0)
摘要:
Airbnb(全稱 AirBed & Breakfast,現在通常只稱為 Airbnb)是一家美國的在線市場平臺和旅行社,它主要提供了一個全球性的住宿預訂服務。通過 Airbnb 的網站或移動應用程序,用戶可以發布、搜索并預訂各種類型的住宿空間,從私人房間到整個公寓或房屋,甚至包括樹屋、船屋等特色住
閱讀全文
posted @ 2025-01-22 21:51
龍陌
閱讀(390)
推薦(0)
摘要:
SASS 提供了兩種不同的語法格式:SCSS (Sassy CSS) 和 縮進格式(Indented Syntax),有時縮進格式也直接被稱為 Sass。這兩種格式在功能上幾乎完全相同,但它們的語法和適用場景有所不同。以下是 SCSS 和縮進格式的主要差異對比及各自的適用場景。 SCSS (Sass
閱讀全文
posted @ 2025-01-22 20:45
龍陌
閱讀(115)
推薦(0)
摘要:
存根組件(Stub Components)是單元測試中的一個重要概念,特別是在使用 Vue.js 進行組件測試時。存根組件用于替代真實組件,通常是為了隔離被測組件的依賴,或者是為了加速測試執行速度。通過使用存根組件,你可以專注于測試當前組件的行為,而不必關心其子組件的具體實現。 為什么需要存根組件?
閱讀全文
posted @ 2025-01-19 15:16
龍陌
閱讀(38)
推薦(0)
摘要:
jest.spyOn 是 Jest 測試框架提供的一個功能,用于創建一個間諜(spy)來監視對象上的方法調用。然而,直接使用 jest.spyOn 來監聽 Vue 組件的生命周期鉤子如 created 并不是最直觀的方法,因為這些鉤子并不是組件實例上的公開方法,而是由 Vue 框架內部管理的。 為了
閱讀全文
posted @ 2025-01-19 12:35
龍陌
閱讀(65)
推薦(0)
摘要:
"moduleResolution": "node" 是 TypeScript 編譯選項之一,它指定了模塊解析策略,具體來說是指定如何查找和解析模塊。當你的項目中使用了 import 或 require 語句來導入其他模塊時,TypeScript 編譯器需要知道去哪里尋找這些模塊以及如何解析它們的路
閱讀全文
posted @ 2025-01-18 20:45
龍陌
閱讀(219)
推薦(0)
摘要:
jsonpath-plus 是一個功能強大且靈活的 JSONPath 實現,用于在 JavaScript 環境中查詢和操作 JSON 數據結構。JSONPath 是一種查詢語言,類似于 XPath 用于 XML 的方式,它允許你以簡潔的方式從復雜的 JSON 文檔中提取特定的數據片段。jsonpat
閱讀全文
posted @ 2025-01-17 22:01
龍陌
閱讀(325)
推薦(0)