对不在 node_modules 中的文件使用 html-webpack-externals-plugin

Question

有谁知道是否有办法让这个插件 (https://github.com/mmiller42/html-webpack-externals-plugin) 适用于我自己的文件，这些文件不在 node_modules 中？

例如：我在 app/js/config/ 中有一些配置数据文件我希望这些文件从所有包中排除，复制到输出 (dist) 文件夹并在运行时从那里读取，这正是该插件所做的，但对于 node_modules.[=14= 中的文件]

我设法让它复制一个测试文件并在 index.html 中插入脚本标签，但是 test.js 文件的内容仍然被捆绑并从那里读取。这是我的实验配置：

new HtmlWebpackExternalsPlugin({
  externals: [
    {
      module: 'test',
      entry: '../../js/config/test.js',
      global: 'test',
    },
  ],
})

任何帮助将不胜感激！

Answer 1

我遇到了同样的问题。当我使用插件 html-webpack-externals-plugin 时，它总是在 node_modules 文件夹中找到库。我知道它已从 this link.

弃用

幸运的是，它推荐了一个可以完美解决这个问题的新库html-webpack-tags-plugin。以下是我的关键配置。

plugins: [
    new CopyWebpackPlugin([
      { from: "./src/Config.js", to: "." },
    ]),
    new HtmlWebpackPlugin({
      template: path.join(__dirname, "src/index.html"),
    }),
    new HtmlWebpackTagsPlugin({
      tags: [{ path: "Config.js", type: "js" }],
      append: false,
    }),
  ],

对不在 node_modules 中的文件使用 html-webpack-externals-plugin

Use html-webpack-externals-plugin for files not in node_modules

webpack

webpack-externals