У меня довольно простой веб-пакет, настроенный с некоторой изюминкой.У меня есть несколько разных способов создания предполагаемого поведения, но мне интересно, есть ли лучшие подходы (я все еще довольно новичок в веб-пакете).
У меня есть базовый TypeScript / Scssapplication и все файлы src находятся в каталоге src.У меня также есть комплект библиотек компонентов, который динамически генерируется с помощью отдельного процесса сборки (запускается через Node).Этот пакет также попадает в каталог src (он содержит некоторые переменные sass и несколько других ресурсов, принадлежащих src).Это src/custom-library-bundle.Моя текущая настройка веб-пакета перемещает соответствующие файлы пакета в каталог public (dist) через CopyWebpackPlugin.Мой веб-сервер разработчиков отслеживает изменения и перезагружается, как и ожидалось.Все это прекрасно работает.
Теперь для поворота.Я установил пользовательский наблюдатель, который существует в другом месте, чтобы отслеживать изменения в пакете библиотеки пользовательских компонентов.Когда происходит изменение, оно запускает тот процесс пользовательской сборки, упомянутый выше.Это (как и ожидалось) изменяет каталог src/custom-library-bundle и запускает несколько просмотров / перезагрузок при заполнении пакета.Технически это работает?И поведение ожидается, но в идеале я мог бы сказать, что нужно дождаться, когда пользовательская работа по установке будет «сделана», и только затем заставит ее выполнить компиляцию / перезагрузку.
Фу.Это не легко объяснить.Вот конфиг веб-пакета, который (надеюсь) поможет уточнить:
devServer: {
contentBase: path.join(__dirname, 'public'),
port: 9000,
host: '127.0.0.1',
after: (app, server) => {
new MyCustomWatcherForOtherThings().watch(() => {
// invoked after the src/custom-library-bundle is done doing its thing (each time)
// now that I know it's done, I want to trigger the normal compilation/reload
})
},
watchOptions: {
ignored: [
/node_modules/
// I've been experimenting with the ignored feature a bit
// path.resolve(__dirname, 'src/custom-library-bundle/')
]
}
}
Идеальный подход: В моем наиболее идеальном сценарии я хочу просто вручную запустить сервер разработки веб-пакетов, чтобы сделать свое дело вмой заказ обратного звонка;пусть он игнорирует src/custom-library-bundle, пока я не скажу ему обратить внимание.Однако я не могу найти способ сделать это.Возможно ли это?
Альтернативный подход # 1: Я мог бы проигнорировать каталог src/custom-library-bundle, переместить обновленные файлы в public (не используя подход webpack), а затем вызвать простоперезагрузка, когда я знаю, что это завершено.Мне это не нравится, потому что я хочу использовать один и тот же процесс, независимо от того, наблюдаю ли я или просто выполняю разовую сборку (я хочу, чтобы все заканчивалось в каталоге public, потому что webpack сделал это, а не потому, что я написалсценарий, чтобы поставить его там под конкретные сценарии).Но, допустим, я преодолел это, как я могу запустить перезагрузку браузера для сервера dev?Возможно ли это?
Альтернативный подход # 2 Я склоняюсь к этому, но мне кажется, что это лишняя, ненужная работа.Я мог бы вывести свой пользовательский процесс сборки в другой каталог (тот, который настраивал мой веб-пакет, вообще не заботился).Когда процесс сборки будет завершен, я могу переместить все файлы в src/custom-library-bundle, где часы получат 1 изменение и выполнят одну услугу / перезагрузку.Это так близко ко мне, но кажется, что я добавляю шаг, который мне не нужен.
Альтернативный подход № 3? Можете ли вы придумать лучший способ решить эту проблему?
Обновление (включая версии):
- webpack
4.26.1 - webpack-dev-server
3.1.14