Правильное объединение встроенных скриптов VueJS с Asp.Net Бритва Mvc

#asp.net-mvc #vuejs2

Вопрос:

Я использую Vue 2.0 с asp.net MVC-бритва. В отличие от других приложений, в которых интерфейс является полностью отдельным приложением SPA, у меня есть компоненты Vue в одном приложении. Причиной этого является система плагинов, в которой у каждого плагина есть свой пользовательский интерфейс, и его компоненты должны находиться и развертываться независимо. Поэтому я не могу создать ни одного СПА-салона.

Таким образом, мои компоненты расположены внутри файлов razor (cshtml), как показано ниже

 <cshtml file start>
   //some html and asp.net stuff

   <script type="text/x-template" id="vue-edit-form">[content]</script>

   <script>
       Vue.component('vue-edit-form',
       {
           //code to work with x-template (api calls, validation, events etc. goes here)
       }
  </script>
</cshtml file start>
 

Все работает совершенно нормально. Однако я не знаю, как правильно использовать минификацию/комплектацию для такого рода настроек. На данный момент, как только страница загружена, если вы посмотрите на инструменты разработчика, вы сможете легко увидеть исходный код компонента.

Как я могу получить комплектацию и минимизацию для этой настройки? Я немного неохотно добавляю раздувание веб-пакета, если у меня нет другого варианта.

Обратите внимание, что таким образом Vue используется во всем приложении.