lagosta

Лагоста

Lagosta — это пользовательский интерфейс для Krill.

В проекте используется Vue.js в качестве платформы Javascript и Element в качестве платформы пользовательского интерфейса.

Требования

• Node.js
• пряжа или нпм

Обратите внимание, что Yarn требует установки дополнительной зависимости, тогда как npm включен в node.js. OTOH, если вы используете npm, вам следует обязательно зафиксировать package-lock.json в репозитории.

Настройка проекта

Чтобы получить все необходимые библиотеки js, запустите

yarn install

или

npm install

Запуск сервера разработки

Vue использует webpack и webpack-dev-server для запуска автокомпилируемого сервера разработки с возможностью горячей перезагрузки, и Krill не является исключением.

Вы можете запустить сервер разработки, выполнив:

npm run serve

Большинство настроек сервера разработки указаны в файле /vue.config.js .

Вы можете выбрать IP-адрес и порт для запуска сервера разработки Krill:

    port: "3003",
    https: true

Вы можете использовать настройку proxy для webpkack-dev-server, чтобы перенаправить HTTP-запросы на ваш локальный экземпляр Krill. Отредактируйте файл /vue.config.js , указав параметр proxy .

Это перенаправит запросы для этой конкретной конечной точки на ваш локальный экземпляр Krill. Обратите внимание, что вам придется перенаправить конечные точки /api , /auth и /stats на Krill.

Например:

...
  devServer : {
    // Krill proxy instance (for API calls).
    // see: https://webpack.js.org/configuration/dev-server/#devserverproxy
    proxy : {
      "/api" : { target : "https://localhost:3000" } ,
      "/auth" : { target : "https://localhost:3000" } ,
      "/stats" : { target : "https://localhost:3000" }
    } ,
...

В этом примере локальный экземпляр Krill работает по адресу https://localhost:3000 (по умолчанию в конфигурации krill).

Вы можете прочитать больше о webpack-dev-сервере здесь.

Создание сборки для развертывания

Чтобы все скомпилировать и минимизировать в папке /dist , вы можете запустить:

 yarn run build

или

 npm run build

Это скомпилирует и минимизирует все JS и CSS. Опять же, поскольку Vue использует веб-пакет, вы можете изменить множество настроек процесса сборки.

См. https://webpack.js.org/concepts/.

Маршрутизация запросов API в производстве

Есть два способа запустить приложение в рабочей среде:

• Настройте свой веб-сервер для проксирования всех вызовов /api , /stats и /auth демону Krill.
• Используйте предоставленный «server.js», чтобы развернуть простой HTTP-сервер, который передает вызовы API (НЕ РЕКОМЕНДУЕТСЯ).

Чтобы использовать последнее, сначала создайте файл .env с параметрами, подходящими для вашей среды.

 PROXY_BASE_URL=https://your-host
SERVE_FOLDER=dist

а затем запустить

 node server.js

Сборка в Docker-контейнере

Только один раз, создайте образ Docker локально:

 docker build -t lagosta-builder .

Как только вы это получите, вы можете сделать:

 docker run -it --rm --name lagosta-builder -v ${PWD}:/tmp/src lagosta-builder /bin/bash
root@06a45bcc9a3e:/tmp/src# yarn install
root@06a45bcc9a3e:/tmp/src# exit

Теперь, когда ваш образ Docker и локальный каталог сборки Lagosta готовы, в будущем вы можете просто запустить yarn build следующим образом:

 docker run -it --rm --name lagosta-builder -v ${PWD}:/tmp/src lagosta-builder /bin/bash
root@06a45bcc9a3e:/tmp/src# yarn build
...
 DONE  Build complete. The dist directory is ready to be deployed.
 INFO  Check out deployment instructions at https://cli.vuejs.org/guide/deployment.html
                                  
Done in 19.66s.

Вывод будет в папке ${PWD}/dist на хосте.