arkit — архитектурные диаграммы для JavaScript, TypeScript и Flow

    arkit (швед. arkitektur)

    Дамы и господа, представляю вашему вниманию arkit — инструмент, который анализирует файлы вашего проекта и генерирует диаграмму зависимостей между ними и внешними модулями. Наверное, проще показать на примере самого arkit:

    архитектурная диаграмма

    Таким образом, по каждому коммиту, эта SVG-диаграмма обновляется и позволяет всегда видеть актуальную общую картину. Обзор возможностей на данный момент:

    • Ассоциирует файлы проекта с указанными компонентами архитектуры;
    • Группирует проекты и отображает зависимости между ними;
    • Поддерживает JavaScript, TypeScript, Flow, а также node-модули;
    • Экспортирует визуализацию архитектуры как SVG, PNG или Plant UML диаграмму;
    • Интегрируется в процесс разработки, поэтому вашм CI, VCS, README и PR довольны.

    Попробуйте его простой командой npx arkit -o arkit.svg в папке проекта и расскажите как вам результат. Также мне интересно была ли необходимость в таком решении и какие альтернативы вы пробовали.
    Поделиться публикацией

    Комментарии 23

      +2

      Увы, упало


      FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

      Циклические зависимости должно разруливать?

        0
        У меня на мою мешанину импортов с легкостью петли нарисовало. У меня правда очень мелкий код пока что.
          0
          Я также тестировал на ReactDOM:

          image
          0
          Уффф, интересно. А можно посмотреть лог, если запустить LEVEL=trace npx arkit?
          0
          А вообще циклические зависимости не должны мешать, он просто нарисует связь в обе стороны.
          0
          с проектом на nuxt.js она отрисовала серверные зависимости норм, а вот уже всё остальное не очень. Всё что в папке pages она не смогла слинковать
            0
            А можно посмотреть пару исходников? Точнее как устроены импорты.
              0
              import furyBasePage from '~/components/base/page.vue'
              import furyActionButton from '~/components/base/actionButton.vue'
              В ~/components/base/page.vue используются компоненты vuetify подключенные в nuxt VuetifyLoader'ом
                0
                Видимо он не распознаёт тильду.
                А где прописано куда она ведёт? В webpack.config?
                  0
                  webpack config инкапсулирован в недрах nuxt.js
                  Причем. пути еще могут и без / выглядеть. Типа так ~assets/style/variables.styl
                    0
                    Записал поддержку webpack resolve alias в roadmap. Спасибо!
                      0
                      С меня звёздочка на гитхабе =)
                        0
                        По рукам! :-)
                          0
                          Заработало в 1.4.0
                          0
                          Заработало в 1.4.0
              0
              какие альтернативы вы пробовали

              Я написал либу для C#. Экспорт в Graphviz.
              Но была немного другая задача, получить архитектурную диаграмму микросервисов, кто куда какие DTO отправляет.
              Поскольку Graphviz сам рисует и выбирает где какой блок разместить, то получилось не красиво, и не наглядно.
                0
                arkit использует PlantUML, который в свою очередь dot и старый добрый Graphviz :-)
                0
                После запуска выводит HTML с телом:
                <pre>Payload Too Large</pre>
                

                Что я делаю не так?
                  0
                  Всё так, это express экономит. Попробуйте, пожалуйста, ещё раз.
                    0
                    Запустил с LEVEL=trace… а там
                    FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed — JavaScript heap out of memory
                    Отправил трейс в личку.

                    Попробовал указать при запуске
                    NODE_OPTIONS='--max_old_space_size=4096'
                    при этом просто вылетает с сообщением
                    Invalid string length
                      0
                      Это в версии arkit@1.3.14?
                        0
                        Да

                Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

                Самое читаемое