Shlop
@Shlop
Программист

Почему из асинхронного компонента на выходе получается два файла?

Здравствуйте, есть такой вот компонент, я часть кода не включил сюда, потому что она не нужна в рамках данного вопроса. Имя файла данного компонента - vue-dropzone.vue а путь elements/vue-dropzone.
<template>
    <vue-dropzone
            ref="myVueDropzone"
            id="dropzone"
            :options="dropzoneOptions">
        <p class="dropzone-elem__title">Загрузить изображение</p>
    </vue-dropzone>
</template>
<script>
     import VueDropzone from 'vue2-dropzone'; // Подключаю dropzone которая в node_modules, скачивал с помощью npm
     export default { ... }
</script>

Потом я этот компонент, асинхронно подгружаю в другом компоненте таким вот образом:
const MyDropzone = () => import(/* webpackChunkName: "js/dropzone" */ './../elements/vue-dropzone');

Ожидалось что будет в итоге один файл загружен dropzone.js, и в нём будет мой компонент, и компонент который скачен был с помощью npm vue2-dropzone. Но загружается почему то два файла.

И такие вот пути у них:
http://rtm/vendors~js/dropzone.js
http://rtm/js/dropzone.js

см. скриншот ниже
5d790b73cd0d1026508871.png

Я так понимаю что по пути: http://rtm/vendors~js/dropzone.js находиться компонент vue2-dropzone
А по пути: http://rtm/js/dropzone.js уже мой компонент, код которого выше.

Подскажите пожалуйста, почему два файла ? Заранее благодарю за ответ
  • Вопрос задан
  • 65 просмотров
Решения вопроса 1
Shlop
@Shlop Автор вопроса
Программист
Похоже что надо копать в эту сторону:
https://webpack.js.org/plugins/split-chunks-plugin/
Проект этот делаю на laravel, используется laravel-mix
Ссылка на документацию из laravel-mix
https://laravel-mix.com/docs/4.0/quick-webpack-con...
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы