你可能不知道的 NestJS 隱藏技巧：Discovery Module
在某些應用場景下，可能會需要去遍歷封裝於 模組（Module） 內的元件，比如：找出帶有特定 裝飾器（Decorator） 的元件，甚至是元件底下的方法，來預先處理一些事情，最典型的案例就是 EventEmitterModule，當某個事件觸發時，會呼叫帶有特定裝飾器的方法。 NOTE：關於 EventEmitterModule 可以參考官方文件的說明。 下方是官方 EventEmitterModule 的範例，透過 EventEmitter2 發送 order.created 事件時，會呼叫帶有 @OnEvent 裝飾器且值為 order.created 的方法： 1234567this.eventEmitter.emit( 'order.created', new OrderCreatedEvent({ orderId: 1, payload: {}, }),); 123456789// ...@Injectable()export class OrderListener { ...
動態載入 Web Component
什麼是 Web Component？Web Component 是一個封裝自定義元件的技術，讓我們可以輕易地在不同應用程式中重用這些被封裝的元件，不僅如此，Web Component 不限定應用程式使用的框架或函式庫，不論今天是 Angular 或 React，甚至是 Vanilla JavaScript 都能夠輕鬆使用。 INFO：關於 Web Component 的詳細資訊可以參考 MDN。 為什麼需要 Web Component？Web Component 的問世，可以實現較理想的 微前端（Micro Frontend） 概念，在過去，會以 iframe 的形式將其他團隊開發的元件、頁面嵌入至自己的系統內來實現微前端，但這樣的做法會有很多的限制，比如：跨域、生命週期等。 透過 Web Component 則可以避免這些問題，因為概念上就是將其他團隊開發的元件程式碼嵌入並串接至自己的系統裡。 NOTE：微前端也可以用 Module Federation 技術來實作，有興趣的話，可以參考相關文件。 動態載入 Web Component目前常見的 Web...