iT邦幫忙

鐵人檔案

2024 iThome 鐵人賽
回列表
Modern Web

蓋一個自己的 Nuxt 3 UI Module 系列

厭倦每次都要重複造輪子刻元件的過程了嗎!?
那把他 module 化吧!

參賽天數 16 天 | 共 16 篇文章 | 0 人訂閱 訂閱系列文 RSS系列文
DAY 11

元件製作 layout

元件製作告一段落之後就發現東西散落在各處,不是那麼方便預覽各個元件,這時候就需要做一個導覽列啦~導覽列會常駐在頁面上,只需要在頁面的部份區域進行元件頁面的切換,...

2024-09-22 ‧ 由 豹告 分享
DAY 12

元件製作 layout -part.2

昨天完成了 layout 後看起來方便很多了呢~ 今天來做一點小小的改動,將原本寫在 layout 頁面的 sidebar 清單移出來方便未來資料管理,將 la...

2024-09-23 ‧ 由 豹告 分享
DAY 13

元件整理

在開始製作 Module 之前可以想想元件想在 Module 中怎麼呈現 比如我希望: 透過 demo 路徑可以進到元件展示的頁面 使用者直接安裝可以使用我預...

2024-09-24 ‧ 由 豹告 分享
DAY 14

安裝模組工具

經過了好幾天的前置作業,終於要開始建立 module 啦! 安裝模組工具 我使用的是官方提供的模板與方法 執行 npx nuxi init -t modul...

2024-09-25 ‧ 由 豹告 分享
DAY 15

installModule

移動檔案到開發模組資料夾 昨天介紹完安裝的基本環境就開始一步一步建立自己的模組啦! 首先我們要移動檔案到模組開發資料夾 接下來會使用到的檔案有 assets...

2024-09-26 ‧ 由 豹告 分享
DAY 16

createResolver & addComonent

在昨天成功安裝模組完之後,會很期待馬上想引入元件來看看是否能成功運行了吧! 我當初也是這麼想的~結果卻發現無法順利引入元件QQ (瞬間冷水潑下來) 這是我當初寫...

2024-09-27 ‧ 由 豹告 分享