Я пытаюсь, чтобы Webpack связывал определенные файлы в зависимости от файла записи.
У меня есть несколько входных файлов в моем проекте. Все они используют общие вспомогательные функции (отдельные модули), но некоторые входные файлы используют слегка измененную версию.
Вот что я сделал до сих пор:
entry1.js
import helper from './helper';
helper();
entry2.js
import helper from './helper';
helper();
helper.js
import example from './example';
export default function helper() {
console.log('common console log for Entry 1 and 2 pages');
example();
}
example.js
const context = window.__CONTEXT__;
export default require(`./example_${context}`).default;
example_entry1.js
export default function() {
console.log('specific console log for Entry 1 page only');
};
example_entry2.js
export default function() {
console.log('specific console log for Entry 2 page only');
};
entry1.html
<script>
window.__CONTEXT__ = 'entry1';
</script>
<script src="entry1.js" />
Вывод консоли браузера:
общий журнал консоли для страниц входа 1 и 2
конкретный журнал консоли только для страницы «Запись 1»
entry2.html
<script>
window.__CONTEXT__ = 'entry2';
</script>
<script src="entry2.js" />
Вывод консоли браузера:
общий журнал консоли для страниц входа 1 и 2
определенный консольный журнал только для страницы входа 2
Есть ли способ сделать что-то подобное в example.js?
export default require(`./example_${__CURRENT_ENTRY_FILENAME__}`).default;
Таким образом, Webpack может связывать entry1.js и entry2.js с их специфическими вспомогательными модулями!
И таким образом я надеюсь избавиться от ужасного window.__CONTEXT__ в моих файлах HTML и JS.
Спасибо!
