使用 Webpack 時，node_modules 中的依賴預設會被包含在建置輸出中。對於打包網頁應用程式來說，這是很有用的行為，但對於某些使用情境，例如使用 Webpack 來建置函式庫或 Node 應用程式，你可能會想排除這些依賴，讓它們在執行時期再從 node_modules 載入。

Webpack 的 externals 選項可讓你指定要從建置中排除的依賴。如果想排除所有依賴，webpack-node-externals 提供了一種簡單的方式，可以建立一個 externals 函式，自動排除專案 node_modules 目錄中的所有依賴。

// webpack.config.js
const nodeExternals = require('webpack-node-externals');

module.exports = {
    ...
    // ignore all modules in node_modules
    externals: [nodeExternals()],
    ...
};

我們的使用情境

在 Mintel，我們擁有一系列構成設計系統的前端函式庫。我們使用 Storybook 進行本地開發，但曾遇到幾次狀況：由於函式庫與 Storybook 的建置流程不同，導致工程師在開發變更時遺漏了一些問題。

為了更早發現這些問題，我們的平台團隊決定統一函式庫與 Storybook 的建置流程，使用相同的 Webpack 設定來建置 Storybook 與要發布的函式庫。

然而，這項變更導致使用這些函式庫的應用程式 bundle 變得更大。函式庫會在建置時將所有依賴一併打包，在有共用依賴的情況下造成重複。透過從 Webpack 建置中排除依賴，我們得以將依賴解析的工作再度上提至使用端的專案，讓套件管理器來處理。