Как изменить имя экспорта по умолчанию для папки в React?

Question

Естественно, в React вы можете импортировать псевдоним ./component/<name>/index.js как ./component/<name>.

Есть ли способ в Webpack изменить имя файла, который используется по умолчанию? В этом случае сменить index.js на другое имя файла?

Answer 1

JavaScript и, соответственно, Webpack допускает файлы index.js по умолчанию только при использовании каталога. Однако при использовании Webpack можно написать плагин, подключающийся к хуку для before-existing-directory и вернуть требуемый файл как index во время сборки.

К счастью, этот плагин уже написан directory-named-webpack-plugin.

  var DirectoryNamedWebpackPlugin = require("directory-named-webpack-plugin");

  resolve: {
    plugins: [
      new DirectoryNamedWebpackPlugin()
    ]
  }

Если есть папка с именем foo, это заставляет веб-пакет искать foo/foo.js вместо файла по умолчанию index. Он также поддерживает пользовательскую функцию transform, так что вы можете выбрать файл, который будет выбран, но я настоятельно рекомендую не делать этого, так как это может очень быстро запутать.

Answer 2

Похоже, я просто пропустил слой объекта. У меня было:

plugins: [
    new DirectoryNamedWebpackPlugin()
]

вместо:

resolve: {
    plugins: [
      new DirectoryNamedWebpackPlugin()
    ]
  }