一、模塊
模塊是Nuxt.js擴展,可以擴展其核心功能並添加無限的集成。模塊只是在引導Nuxt時按順序調用的函數。框架在加載之前等待每個模塊完成。
(1)模塊幾乎可以自定義Nuxt的任何地方。
(2)Nuxt模塊可以合並到npm包中。
(3)模塊只是簡單的功能,它們可以打包為npm
模塊或直接包含在項目源代碼中。
二、Nuxt.js官方模塊
- @nuxt/http: 基於ky-universal的輕量級和通用的HTTP請求
- @nuxtjs/axios: 安全和使用簡單Axios與Nuxt.js集成用來請求HTTP
- @nuxtjs/pwa: 使用經過嚴格測試,更新且穩定的PWA解決方案來增強Nuxt
- @nuxtjs/auth: Nuxt.js的身份驗證模塊,提供不同的方案和驗證策略
三、模塊的存放、配置和發布
(1)存放
建議將項目工程自身添加的模塊放置在工程源代碼目錄下的modules目錄中。
(2)配置
在nuxt.config.js文件通過modules屬性來配置相關模塊,支持參數的可配置。
(3)發布
如果要將模塊發布為npm包,則需要在模塊文件中配置module.exports.meta選項。Nuxt內部使用meta
來更好地處理要發布的包。
四、異步模塊
Nuxt支持在異步模塊,可以通過下面幾種方式來實現:
(1)使用async/await
僅在Node.js > 7.2中支持使用async
/ await。
(2)使用回調函數
(3)返回Promise
五、鈎子上運行任務
模塊可能只需要在特定條件下執行操作,而不僅僅是在Nuxt初始化期間。我們可以使用強大的Tapable插件來執行特定事件的任務。Nuxt將等待鈎子返回Promise
或被定義為async
(異步)。
六、自定義Nuxt命令
從v2.4.0
開始,可以通過Nuxt模塊的包(package)添加自定義nuxt命令。為此,必須NuxtCommand
在定義命令時遵循API規則。在命令所在的文件中,注意調用/usr/bin/env
來檢索Node可執行文件。另請注意,ES模塊語法不能用於命令,除非您手動合並esm
到代碼中。接下來,制定命令的設置和行為。若要使命令可以通過Nuxt CLI識別bin
,請使用nuxt-module
約定將其列在package.json
的部分下,該約定module與包名稱相關。一旦安裝了軟件包(通過NPM或Yarn),就可以在命令行上執行自定義命令了。