检查是否存在使用WebPack的依赖关系

Question

经常我需要检查WebPack中是否存在依赖关系。例如，我有一堆ID，例如[0,1,3,4,5,6,7,8，...]，其中一些ID具有我应该加载的图像，而其他则没有。

我如何检查应该加载图像是通过创建包含具有图像的值并执行数组的值来检查图像的。像[1,5,7，...]。

这开始变得非常有问题，因为我每次添加或删除图像时都需要更改此数组。

有没有办法检查我是否需要存在的模块？

据我所知，WebPack 1中有一种方法，但它关闭了。

https://github.com/webpack/webpack/issues/526

我发现它仍然应该根据文档这样的工作（https://webpack.js.org/api/module-methods/#require-resolve-weak），但我确实得到了Error: Cannot find module。

。

这就是我的确在做的：

$scope.getExplorationImage = function (imageId) {
    if(__webpack_modules__[require.resolveWeak('image/exploration/' + imageId + '.png')]) {
        console.log("Image exists for: "+imageId)
        return require('image/exploration/' + imageId + '.png');
    } else {
        console.log("Image doesn't exists: "+imageId)
    }
};

我正在使用WebPack 3.5.5。如果可能的话，我想避免尝试/捕获解决方案。

Answer 1

我知道问题状态

如果可能的话，我想避免尝试/捕获解决方案。

但是，如果有人来这里试图让WebPack在测试模块是否存在时不崩溃，则可以使用以下方式：

// try if module exists
try {
   var module = require('../path/to/module');
}
// fallback if does not exists
catch(err) {
   var module = require('../path/to/fallback/module');
}

您仍然会在控制台中打印出一个错误，但是WebPack不会崩溃应用程序，并正确地退回了catch{};

Answer 2

您所做的是方式，但仅检查该模块是否已经加载，如果要检查该模块是否可用，则需要将其转换为异步功能。

在这里查看：https：//github.com/webpack/webpack/sissues/526

您可以编写一个功能以简单地说明所有内容：

function moduleExists(moduleId) {
  return new Promise((resolve, reject) => {
    // check if that module was already loaded
    if(__webpack_modules__[require.resolveWeak(moduleId)]) {
      return resolve();
    }
    return import(moduleId)
      .then(() => resolve(), () => reject())
    ;
  });
}
moduleExists('foobaz' /* take care of absolute paths */ )
  .then(() => alert('yes'))
  .catch(() => alert('noope'))
;
const exists = await moduleExists('bar');
if(exists) { /* do stuff */ }

Answer 3

import(/* webpackIgnore: true */ 'ignored-module.js');

https://webpack.js.org/api/module-methods/#magic-comments