问题标签 [dllplugin]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
351 浏览

webpack - 使用 Webpack 将排除的(外部)依赖项暴露给 Dll 构建

我有一个 webpack 构建过程,DllPlugin用于预构建包列表。这使开发人员可以针对他们正在积极开发的特定软件包,并有助于加快重建过程。

我如何配置 webpack 以从 Dll 构建中排除“package-abc”,尽管 Dll 构建中的“package-xyz”取决于它。

我尝试了配置webpackConfig.externals和的不同组合libraryTarget,但到目前为止还没有运气。

0 投票
1 回答
994 浏览

javascript - 如何将 webpack DLL 注入现有的 HTML?

首先,使用 webpack.DllPlugin 生成 vendor.dll.js。

其次,使用 html-webpack-include-assets-plugin 将 vendor.dll.js 插入到由 HtmlWebpackPlugin 生成的 html 中。像这样:

问题:

如何在不使用 html-webpack-plugin 的情况下将 vendor.dll.js 插入现有的 html?

谢谢

0 投票
1 回答
391 浏览

javascript - 将 webpack DllPlugin 与 bootstrap 4 beta 一起使用会导致 Uncaught ReferenceError

我在我的开发环境中使用 DllPlugin,但是当我将引导程序添加到构建中时,我​​的供应商 dll 会中断。如果我注释掉引导程序,所有其他参考都在工作。这是我的配置文件的相关部分。

对于供应商构建

在运行时配置中,我只是引用链接,所以

清单输出是

最后错误是

我是 DllPlugin 的新手,但设置看起来很简单。谢谢。

0 投票
0 回答
406 浏览

webpack - 外部库如何需要dll中的依赖?

我建立了一个库。我希望将它与 sript 标签一起用作外部库,就像这样:

我的库需要 react,我希望使用 mylibrary 的项目将在环境中提供 react。我在我的项目中使用 webpack dll 插件在名为 vendor.js 的包中构建诸如 react、lodash 之类的库。但它不起作用,我的库找不到我希望我的项目可以提供的外部库。我该如何解决这个问题?

这是我的库中的 webpack 配置:

这是我项目中的 webpack 配置:

dll配置:

0 投票
0 回答
512 浏览

webpack - Webpack dll 参考插件给出运行时错误

我正在使用webpack DllReference插件来引用我的node_modulespolyfills从我的webpack.config,这样我每次构建项目时都不必编译它们。该插件正在正确编译并按应有的方式创建js文件Json,但是当我想运行该项目时,它function expected在我的 main.js 中给出了 js 错误,但是如果我不使用该插件,它运行得非常好。

我使用以下链接来研究 dll 参考插件的工作原理https://medium.com/@emilycoco/how-to-use-the-dll-plugin-to-speed-up-your-webpack-build-dbf330d3b13c

0 投票
1 回答
1351 浏览

webpack - Webpack 供应商库未拆分为单独的包

我正在尝试使用autodll-webpack-plugin ( v0.4.2) 将我的供应商和应用程序包分开。这个包是webpack的 DllPlugin 和add-asset-html-webpack-plugin 的顶级插件,用于自动排序index.html.

这个插件应该做的是分离供应商库和应用程序代码。我可以使用webpack中的 CommonsChunkPlugin 来做到这一点,但是这样每次重新编译时都会重新生成包。与生成供应商捆绑包一次并且仅在更改库时重新编译它相比效率较低。


问题

我让这个插件“工作”(它正在输出一个vendor.bundle.js)。这里唯一的问题是,当我app.bundle.js使用webpack-bundle-analyzer ( v2.13.1) 检查时。我可以看到其中的所有 node_modules 也都vendor.bundle.js加载到了这个包中,因此插件无法正常工作。

app.bundle.js


版本

我在用:

  • 网页包v4.11.0
  • 通天塔装载机v7.1.4
  • 通天塔核心v6.26.3
  • autodll-webpack-插件v0.4.2

项目结构

我的项目具有以下文档结构:


我的 webpack.common.js此代码与开发和产品构建共享

根据上下文键的文档应该autodll-webpack-plugin用于分离。所以我认为这就是问题所在。

文档描述您应该引用它所在的文件夹webpack.config.js,但我有 3 个,我需要引用哪一个?我的文件夹被调用webpack,而不是config你在文档中看到的,在..这里也正确吗?

0 投票
2 回答
346 浏览

angular - Angular 5 Webpack 4 Rxjs 5 DllPlugin - 到处都是重复的 RxJ

我在用着 :

并将库与 DDL 插件捆绑在一起。

正如你在上面看到的,我已经将 Rxjs 声明为一个单独的包。我的自定义库 pck-referentiel 使用 rxjs 并在 99% 的时间通过以下方式导入它:

这是结果:

在此处输入图像描述

(我圈出了每一个重复的 rxjs)

我们可以清楚地看到 rxjs 分散在所有各种第三方库中,包括我的库。

使用 DllPlugin 引用 RxJs 的正确方法是什么,因为它不会在导入它的每个模块中重复?

0 投票
0 回答
227 浏览

javascript - 使用 webpack 和 typescript 在项目之间共享代码

我有以下结构:

  • 项目1

    • 应用程序.ts
    • tsconfig.json
    • webpack.config.js
  • 项目共享

    • 共享.ts
    • tsconfig.json
    • webpack.config.js

ProjectShared 使用“./shared.ts”生成一个 DllPlugin,例如“jquery”,Project1 引用它。在我的 Project1 的 HTML 中,我想包含引用的 vendor.js 和 bundle.js。

现在,例如,当我jquery从 Project1 导入时,它使用 DLL 中的代码,以便该部分按预期工作。(./node_modules/jquery 在两种情况下都是相同的)

但是,如果我导入“../ProjectShared/shared”,它会编译,但此代码不包含在 DLL 中,而是再次包含在包中。(../ProjectShared/shared.ts 与 ./shared.ts 不同)

如果我然后将 ReferencePlugin 的上下文切换到 ../ProjectShared/ 它可以工作,但 jquery 将不会从 DLL 中使用。(./node_modules/jquery != ../ProjectShared/node_modules/jquery)

我可以看到为什么会发生这种情况(不同的上下文),但是如果我想在这两个项目之间共享代码而不必将它们移动到模块但还希望模块也被共享怎么办?

我可以看到,如果我使用“../ProjectShared/node_modules/jquery”而不是“jquery”,它可能会起作用,因为然后上下文再次相同。但即使我在 tsconfig 中使用路径或在 webpack 中使用 resolve.alias,这看起来也很难看。

做这样的事情的推荐方法是什么?

0 投票
0 回答
300 浏览

javascript - Webpack DllPlugin - 意外行为

我在我的 react 项目中使用 webpack dllplugin 进行开发配置。我发现我的两个文件没有更新更改。我发现这是因为它们被添加到了 dll 清单中。下面是我的 dll webpack 配置文件和运行以下命令后创建的清单:

cross-env BUILDING_DLL=true webpack --display-chunks --color --config internals/webpack/webpack.dll.babel.js --hide-modules.

webpack.dll.babel.js:

reactBoilerplateDeps.json:

我不明白为什么app\utils\request.jsapp\env.js文件会添加到清单文件中,这HarmonyModules : true意味着什么。

任何帮助表示赞赏。谢谢 :)

0 投票
0 回答
373 浏览

javascript - 有没有办法从 Webpack DllPlugin 供应商包中全局公开模块?

使用 Webpack 4,我正在创建一个包和一个供应商包。供应商包包含 jQuery,代码包使用“import * from jquery”引用 jquery。这完美地工作。

但是,我现在需要使用第 3 方(已经缩小)的 javascript 文件。该文件期望 jquery 在全局窗口对象上显示为“$”。我的包也需要在新的缩小文件 之后加载。

所以我有:

作为我目前的解决方法。静态 jquery 文件将 $ 对象链接到全局命名空间,然后 vendor.js 文件允许我继续在我的包中使用“导入”。

那么,我如何只加载一次 jquery,并以两种方式使用它呢?由于我加载内容的方式,这似乎与我在网上看到的大多数问题略有不同。

这是我现在配置的一个小例子:

在我的正常配置中,我使用:

因此,我可以在全局“vendor_hash”对象中找到 jquery,但无论我尝试什么,我都无法将其映射到 $(大多数插件似乎看到 $ 从未在我的任何代码中使用为捆绑提供,因此似乎不包括它)。如果我在我的“entry.js”文件中添加这样的东西,那么它仍然不起作用: