Vue js: Как лучше всего рекомендовать структурирование кода для написания веб-приложений с помощью vuejs

Question

Я начинаю с проекта vuejs + Typescript (шаблон класса).Я следую архитектуре MVVM для моей базы кода.Мне не ясно, как структурировать код для достижения

1. Разделение ответственности за разные уровни (представления, бизнес, управление состоянием и сеть).
2. Упаковка для представлений, настраиваемаямногократно используемые компоненты, сущности, сеть, дополнения, утилиты, конфиги и ресурсы.

Моя текущая структура для папки src:

src
 |-- api
      |-- entity
            |-- entity.ts // business entity 
            |-- entity-service.ts // wrapper for network operations
 |-- assets // images, js libraries
 |-- config
      |-- inversify.ts // for dependency injection 
 |-- network
      |-- GRPCHandler.ts // making GRPC requests
      |-- HTTPHandler.ts // making HTTP requests
      |-- protos
           |-- sample.proto 
 |-- plugins
      |-- vuetify.ts
 |-- store
      |-- vuex-modules
           |-- module // registration module
                 |-- a-module.ts  // sign-in-module.ts
                 |-- b-module.ts  // sign-up-module.ts
                 |-- view-model.ts  // user-view-model.ts
      |-- store.ts
 |-- style
      |-- styles.scss
 |-- utilities
 |-- views
      |-- domain // user 
            |-- view1.vue // login.vue  
            |-- view2.vue // signup.vue 
      |-- components
            |-- reusable-component1.vue
 |-- App.vue // Entry point 
 |-- main.ts
 |-- router.ts
tests // unit and e2e
.env.[prod/staging/devlopment] // environment variables`

Я прошел через несколько открытых источниковпроекты, но все имеют разные реализации.