Разделение определенных файлов (config), чтобы их можно было редактировать после процесса сборки - PullRequest
Новая
       17

Разделение определенных файлов (config), чтобы их можно было редактировать после процесса сборки

0 голосов
/ 02 мая 2019

Я работаю над приложением, в котором у меня есть файлы конфигурации, которые содержат ряд настраиваемых параметров, которые передаются в мое приложение в различных местах (например, статический текст, слои карты и т. Д.). В настоящее время в моем процессе веб-пакета эти файлы конфигурации объединяются в процессе build и больше не редактируются после развертывания. Я бы хотел избежать создания сборок для таких изменений конфигурации.

В настоящее время я использую webpack file-loader, чтобы поместить все мои ресурсы (только svgs на данный момент) в их собственную папку во время процесса сборки, и они полностью доступны для редактирования. Я могу поменять в этой папке все, что захочу, и эти изменения будут учтены в сборке. Я чувствую, что могу сделать то же самое с моими конфигурационными файлами. Следуя структуре моей функциональности изображений, я написал точно такой же код для обработки моей конфигурации. Однако, когда я пытаюсь запустить сборку, я получаю сообщение об ошибке, из-за которого не могу прочитать свои конфигурации, где я импортировал их в свое приложение React. Я чувствую, что я делаю те же самые вещи с этими файлами конфигурации, как и с моими изображениями, поэтому я не уверен, в чем дело.

Файл деталей Webpack (где существуют функции для использования в dev / prod) 

exports.loadImages = ({ include, exclude, options } = {}) => ({
  module: {
    rules: [
      {
        test: /\.(png|jpg|svg)$/,
        include,
        exclude,

        use: {
          loader: 'file-loader',
          options,
        },
      },
    ],
  },
});

exports.loadConfig = ({ include, exclude, options } = {}) => ({
  module: {
    rules: [
      {
        test: /^..*\/(config\/)..*\.js$/,
        include,
        exclude,

        use: {
          loader: 'file-loader',
          options,
        },
      },
    ],
  },
});

Производственный файл Webpack (часть того, что запускается в процессе сборки) 

parts.loadImages({
  include: PATHS.app, //root level
  options: {
    limit: 15000,
    name: 'assets/[name].[ext]',
  },
}),

parts.loadConfig({
  include: PATHS.app, //root level
  options: {
    limit: 15000,
    name: 'config/[name].[ext]',
  },
}),

В настоящее время мои изображения загружаются в мою папку сборки и загружаются в приложение должным образом. Если я изменяю их каким-либо образом, по форме или по форме, изменения отображаются в сборке, поэтому я предполагаю, что это означает, что они не связаны.

Исходя из этой логики, я бы предположил, что я настроил свой loadConfig таким же образом. В настоящее время он копирует файлы в процесс сборки, но когда я запускаю сборку, я получаю сообщение о том, что конфигурация не найдена (точнее, я пытаюсь перебрать свойства внутри конфигурации, используя forEach() и Cannot read property 'forEach' of undefined). Это говорит о том, что он не загружается в сборку (плохо), но также не связывается в процессе сборки (хорошо).

...