如何在完全独立的webpacked应用程序中访问Javascript

时间:2017-06-05 16:54:26

标签: javascript webpack

我正在使用现有的大型客户端Web应用程序,使用Babel和Webpacked进行编译。

我正在编写一个单独的小项目,需要利用现有代码,但无法在本地文件系统中访问它。这是一个节点/网络应用程序,可用作测试工具,允许远程开发人员创建与我们的应用程序交互的资产。我需要做的是能够导入和使用主应用程序导出/使用的任何JS类,而无需在本地文件系统上使用该代码。

此问题的答案指向在webpack config的输出部分中使用库选项: Calling webpacked code from outside (HTML script tag)

我在其中一条评论中使用了主要答案下面的建议,用于多个入口点,例如: "我们有多个入口点,所以在输出部分,我改为库:[" 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/tree/master/examples/multi-part-library

1 个答案:

答案 0 :(得分:0)

好吧,万一其他人遇到过这个问题,这个问题确实有些奇怪,我做了以下几点:

  

将Webpack构建转换为库,并使用' umd'作为图书馆目标

     

将Webpack从v1.14升级到v2.x以使用导出默认类而不仅仅是module.exports

     

关闭Uglification和Chunking

这意味着我可以使用Webpack在一个地方编译一个大项目,结果输出文件可以导入并在完全不同的项目中使用而无需访问原始文件。