Мое приложение имеет значительную app.js
(6 тыс. Строк, 9 МБ), которую необходимо разделить для эффективности и загружать на более мелкие куски, когда и где это необходимо.Я пытаюсь загрузить второй файл .js только на некоторые страницы, которые используют компоненты, установленные в первой.Например:
<script src="/js/app.js?id=0ee4f7c5f4eaacfc778c"></script>
<script src="/js/sponsor.js?id=0ee4f7c5f4eaacfc778c"></script>
webpack.mix.js
mix.js('resources/assets/js/app.js', 'public/js')
.js('resources/assets/js/sponsor.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css')
.version()
.sourceMaps();
При использовании этого подхода sponsor.js
имеет длину около 600 строк (хотя мой компонент только~ 100) и похоже, что 500 из этих строк представляют собой кучу кода автозагрузки веб-пакетов.Технически этот код уже существует в начальном app.js
. Как создать отдельный набор компонентов vue для другого раздела моего приложения без дублирования автозагрузки веб-пакета?