如何在完全獨立的Webpacked應用程序中訪問Javascript

Question

我正在使用Babel和Webpacked轉譯的現有大型客戶端Web應用程序。

我正在編寫一個單獨的小項目，該項目需要利用現有代碼，但是無法在本地文件系統中訪問它。 這是一個Node / web應用程序，將用作測試工具，允許遠程開發人員創建與我們的應用程序接口的資產。 我需要做的是能夠導入和使用主應用程序導出/使用的所有JS類，而無需在本地文件系統上使用該代碼。

該問題的答案指向在webpack配置的輸出部分中使用庫選項： 從外部調用Webpacked代碼（HTML腳本標記）

我已經在主要回答下面的建議中為其中一個注釋中的多個入口點使用了建議，例如：“我們有多個入口點，因此在輸出部分，我改為將其設置為庫：[“ GlobalAccess”，“ [name] “]。然后使var成為具有每個入口點成員的對象：GlobalAccess.EntryPointFoo，GlobalAccess.EntryPointBar等。”

我的輸出部分如下所示：

output: {
    // the name of the output file (i.e. same as the input file)
    path: './',
    library: ['GlobalAccess', '[name]'],
    filename: '[name].js'
}

但是，完成構建后，Webpack的輸出塊與不帶此選項的輸出塊完全相同。 生成的任何文件中均不存在“ GlobalAccess”。 我應該在輸出塊中看到什么來告訴我它的工作原理？ 官方文檔非常稀疏。.https ://webpack.js.org/configuration/output/#output-library，但是此示例顯示了如何設置庫，因此每個條目都具有不同的命名空間： https：// github。 COM /的WebPack /的WebPack /樹/主/示例/多部件庫

Answer 1

好吧，以防萬一有人遇到這個問題，這個問題確實有點奇怪，我做了以下工作：

將Webpack構建轉換為庫，以“ umd”作為庫目標

將Webpack從v1.14升級到v2.x，以便使用導出默認類，而不僅僅是module.exports

關閉丑化和分塊

因此，這意味着我可以使用Webpack在一個地方編譯一個大項目，並且可以將生成的輸出文件導入並在完全不同的項目中使用，而無需訪問原始文件。