Vue.js собрать и развернуть в один файл

Question

У меня есть приложение Vue.js, которое я создал из веб-пакета, и когда я собираю (npm run build), оно создает папку 'dist' со папками static / css и static / js соответственно.Я получаю

• app.12345.js *
• app.12345.map
• manifest.556.js *
• manifest.556.js.map
• vendor.991.js *
• vendor.991.js.map

В создаваемом файле index.html он выглядит толькоиспользуя файлы, отмеченные звездочкой (*).У меня вопрос, есть ли способ сжать эти 3 в один файл, поэтому мне нужно ссылаться только на один файл на моей странице индекса?Нравится ~ / myApp.js?Я читал о порции, но я не могу получить меньше, чем 3 файла в списке.

Answer 1

Вы можете, но не должны.

Смысл этого разделения состоит в том, чтобы сократить время загрузки и использование полосы пропускания при обновлении приложения.Редко меняющиеся вещи - Vue, библиотеки, такие как Bootstrap и т. Д. - помещаются в файл vendor, тогда как часто меняющиеся элементы помещаются в основной файл JS.Таким образом, для внесения незначительных изменений в ваше приложение требуется только, чтобы пользователь повторно загрузил файлы приложения (которые, как правило, довольно малы по размеру файла), а не все большие библиотеки, которые использует .

Вероятно, этим управляет CommonsChunkPlugin в конфигурации Webpack.

Answer 2

Вопрос в том, почему вы хотите это сделать?Это только для меньшего количества кодов, но если проект становится больше, загрузка одного файла занимает больше времени, чем три отдельных файла.