CommonJS

CommonJS 模組規範是 Node.js 中用於處理模組的標準。模組非常方便，因為它們允許你封裝各種功能並將這些功能作為庫暴露給其他 JavaScript 文件。 CommonJS 模組規範是 Node.js 中用於處理模組的標準。 在瀏覽器中運行的客戶端 JavaScript 使用另一種標準，稱為 ES Modules。 模組非常方便，因為它們允許你封裝各種功能並將這些功能作為庫暴露給其他 JavaScript 文件。它們讓你可以創建明確分離且可重用的功能片段，每個片段都可以單獨進行測試。 巨大的 npm 生態系統是基於這種 CommonJS 格式構建的。 導入模組的語法如下： const package = require('module-name') 在 CommonJS 中，模組是同步加載的，並且按照 JavaScript 運行時找到它們的順序進行處理。這個系統是為了服務器端 JavaScript 而設計的，並不適用於客戶端（這就是為什麼引入了 ES Modules 的原因）。 當一個 JavaScript 文件導出其定義的一個或多個符號（變量、函數、對象）時，它就是一個模組： uppercase.js exports.uppercase = (str) => str.toUpperCase() 任何 JavaScript 文件都可以導入並使用該模組： const uppercaseModule = require('uppercase.js') uppercaseModule.uppercase('test') 你可以導出多個值： exports.a = 1 exports.b = 2 exports.c = 3 並使用 解構賦值 個別導入它們： const { a, b, c } = require('....

在進行項目開發時，有時會遇到以下錯誤： TypeError: Cannot assign to read only property 'exports' of object '# <Object>' error 該錯誤是由 Webpack 生成的，它表示您試圖在需要使用 ES 模塊 的地方使用了 CommonJS！ 請避免使用 CommonJS 語法： const myfunction = () => {} module.exports = myfunction 改用 ES 模塊語法： const myfunction = () => {} export default myfunction 然後，您可以像這樣導入導出的函數或對象： import myfunction from './myfunction' 您也可以從文件中導出多個函數或對象： myfunctions.js const myfunction1 = () => {} const myfunction1 = () => {} export { myfunction1, myfunction2 } 然後，您可以像這樣導入它們：...