如何在多页PHP应用程序中集成Webpack

Question

我正在使用一个旧的Codeigniter网站，其中Javascript代码库很乱，结构很差，我想使用Webback来管理脚本。 我的目标是开始使用它来捆绑我拥有的代码，并逐步重构它以利用模块和导入。

目前我正在开发中使用Gulp（但主要用于缩小文件）和Carabiner （Codeigniter库）以在视图中插入脚本。

这些脚本都是作为IIFE编写的，不是捆绑在一起的，因此在每个控制器函数中，我都有一个该页面所需的脚本数组。 例如：

public function homepage()
{
    $this->carabiner->js([
        ['libraryThatIOnlyNeedHere.min.js'],
        ['myscript1.js'],
        ['myscript2.js'],
        ['myscript3.js'],
    ]);

我想使用Webpack创建一系列包，这样我最终会在每个页面上加载最多两个文件：一个用于库，一个用于我的脚本。

但是，我在Webpack中看到的所有实际例子都是针对单页应用程序，将所有内容捆绑在一起非常容易。

在我的案例中，最好的方法是什么？ 考虑到代码仍未准备好正确使用模块和导入，我是否应该在Webpack配置文件中创建许多入口点，可能每个页面都有一个入口点并列出该页面中所需的每个脚本？

Answer 1

webpack背后的主要思想是从提供的源构建模块图，然后将其组合成bundle。 如果您的代码没有明确的依赖关系 - 最好先使用任何可用的方法（AMD，CommonJS等）从每个文件创建一个模块。 您需要创建模块标识符并为每个模块定义依赖关系。 例如，阅读本文可能是值得的。

作为中间步骤，您可能希望使用某些加载程序（如Require.JS）来加载模块化代码。

在此步骤完成之前 - Webpack没有太多用处。