Vue.js сборка модуля - PullRequest
Новая
       19

Vue.js сборка модуля

2 голосов
/ 06 апреля 2019

У нас есть проект около 100 страниц. Мы переносим наш интерфейс на новые технологии. Мы почти завершили Vue.js (с Vue Cli). Vue CLI - это сборка проекта в одном build.js. У нас есть проблемы с этим. У нас частые изменения требований. Поэтому после каждого небольшого изменения нам нужно будет загружать целые сборки JS, и для этого потребуется регрессионное тестирование всего проекта. Есть ли способ, что сборка будет модульной? Так что только измененный модуль должен быть загружен в живую после изменений.

1 Ответ

1 голос
/ 08 апреля 2019

Использование маршрутизатора Vue:

Следующий подход скажет компилятору (Webpack) «вернуть» компонент против «включая» его. В результате данный компонент «запирается» в собственный файл для отложенной загрузки.

, например 

export default new Router({
    routes: [
        // Home component to be included in bundle.js
        {
            path: '/',
            name: 'home',
            component: Home
        },
        // code splitting - generate a separate unique chuck for about component.
        {
            path: '/about',
            name: 'about',
            component: () => import(/* webpackMode: "lazy" */ '@/views/About.vue')
        }
    ]
})

Вывод = bundle.js и about.js или ... 100 других файлов, если у вас есть компонент на страницу.

Использование веб-пакета:

Вы можете расширить и / или изменить конфигурацию компилятора (веб-пакета) по умолчанию, добавив файл vue.config.js в корневой каталог проекта.

например 

// vue.config.js
module.exports = {
  configureWebpack: config => {
    if (process.env.NODE_ENV === 'production') {
      // mutate config for production...
    } else {
      // mutate for development...
    }
  }
}

Обязательно прочитайте всю документацию по https://cli.vuejs.org/guide/webpack.html, так как некоторые настройки не должны изменяться напрямую.

...