chieftan frontend

酋长前端

Aurelia Web应用程序，该应用程序消耗了任务自动化的酋长API

入门

要设置开发环境，您将需要安装在本地计算机上的Node.js。您可以从这里下载它。

完成此操作后，克隆酋长存储库并运行npm install以安装Chieftan要求的各种依赖关系。

发展

开发环境围绕Webpack构建，并启用了热模块重新装载，从而允许（近）实时更新样式表和代码（如果尚未运行），则没有页面重新加载。您可以通过运行npm run server:dev从项目文件夹中运行开发服务器，然后在浏览器中访问http://localhost:3002 。

部署

部署涉及构建应用程序的生产包，然后将dist文件夹的内容放在服务器上。要构建生产包，只需运行npm build并等待WebPack完成即可。

如果您希望为前端错误启用Sentry错误报告，则应将SENTRY_DSN环境变量设置为公共Sentry DSN。您也可以通过设置VERSION环境变量来标记发布版本。

示例构建脚本

SENTRY_DSN= " https://[email protected]/1 " VERSION= " $( git rev-parse HEAD ) " npm run build

此构建脚本将使用当前的Git SHA和配置Sentry错误报告标记版本。

不错的网址

值得注意的是，如果您希望使用html5 push state api用于NICE URL，则需要配置Web服务器以服务于所有404s的index.html文件。

使用nginx可以使用try_files指令轻松完成这一点。

示例NGINX配置

 server {
  listen :80 default;
  hostname chieftan.emss.co.za;

  root /var/www/chieftan/dist;

  # Serve the frontend
  location / {
    try_files $url $url.html index.html;
  }

  # Pass API requests to the application instance (basic)
  location /api {
    proxy_pass http://127.0.0.1:8000;
  }
}

Docker图像

您也可以使用Docker部署酋长前端，以构建图像，只需运行npm build && docker build .使用最新编译的应用程序包构建容器映像。

该容器基于nginx:alpine ，使其非常轻巧，默认情况下会在端口3000上收听。您可以按照NGINX Docker图像页面上的说明进行配置不同，或将其放置在生产部署中的反向代理后面。