Блог

Главная - Вопросы по программированию - Требовать файл, отправленный плагином webpack через compilation.assets[] =

Требовать файл, отправленный плагином webpack через compilation.assets[] =

#javascript #webpack

#javascript #webpack

Вопрос:

Я использую плагин webpack-free-tex-packer для упаковки множества изображений в атласы с этими строками в webpack.config.js :

 ...
plugins: [
    new WebpackFreeTexPacker(path.resolve(__dirname, 'textures'), 'atlases', {
        textureName: 'atlas',
        width: 512, height: 512,
        padding: 1,
        allowRotation: false, allowTrim: false,
        detectIdentical: true,
        exporter: "Pixi",
    }),
],

который, в свою очередь, генерирует сгенерированные атласы здесь путем настройки свойств на compilation.assets . Это работает, и выходные данные отображаются при сборке:

 atlases/atlas-0.json   1.51 KiB          [emitted]
 atlases/atlas-0.png   32.6 KiB          [emitted]
atlases/atlas-1.json  689 bytes          [emitted]
 atlases/atlas-1.png   3.03 KiB          [emitted]

Однако, как бы мне теперь импортировать сгенерированные файлы JSON из модуля JavaScript?

Я пытался сделать

 const atlases = {};
const r = require.context('../atlases/', false, /^atlas-d .json$/);
r.keys().forEach(key => atlases[key] = r(key));

(наряду с любой другой комбинацией метода импорта и 'atlases/' вместо относительного пути), но я получаю ошибку

 ERROR in ./src/main.js
Module not found: Error: Can't resolve '../atlases/' in '/home/axel/git/project/src'
 @ ./src/main.js 38:8-66

Комментарии:

1. Я не уверен, что это из-за box поддержки .json . webpack.js.org/guides/dependency-management

2. Можете ли вы поделиться полной конфигурацией webpack и структурой репозитория?

3. @tmhao2005 Да, это на github.com/axelf4/pokemon/tree/tex-packer

Ответ №1:

Я думаю, что это невозможно использовать require.context для загрузки всех встроенных файлов JSON здесь, так как webpack это поможет вам искать файлы на диске во время выполнения сборки, что означает, что для этого требуются файлы, существовавшие в то время, но мы создали файлы JSON только после завершения сборки.

Итак, я думаю, вы можете загрузить встроенные файлы JSON через http в свой каталог активов в качестве примера того, что репозиторий сделал для просмотра файла JSON:

 <div>
  <object type="application/json" data="assets/atlas.json" />
</div>