lagosta

拉戈斯塔

Lagosta 是 Krill 的使用者介面。

本專案使用 Vue.js 作為 Javascript 框架，使用 Element 作為 UI 框架。

要求

• Node.js
• 紗線或 npm

請注意，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中指定。

您可以選擇執行 Krill 開發伺服器的 IP 位址和連接埠：

    port: "3003",
    https: true

您可以使用 webpkack-dev-server 的proxy設定將 HTTP 請求重新路由到本機 Krill 實例。透過指定proxy選項來編輯/vue.config.js檔案。

這會將對該特定端點的請求轉送到您的本機 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-server 的更多資訊。

建立用於部署的構建

要編譯並縮小/dist資料夾中的所有內容，您可以執行：

 yarn run build

或者

 npm run build

這將編譯並縮小所有 JS 和 CSS。同樣，由於 Vue 使用 webpack，您可以修改建置過程的許多設定。

請參閱 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資料夾中。