diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index db5e402d..370a0d23 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -11,7 +11,7 @@ jobs: strategy: fail-fast: false matrix: - target: ['ci:build', 'ci:test', 'ci:lint', 'ci:e2e', 'build docs'] + target: ['ci:build', 'ci:test', 'ci:lint', 'ci:e2e'] runs-on: ubuntu-latest name: ${{ matrix.target }} steps: diff --git a/.github/workflows/deploy-demo-app.yml b/.github/workflows/deploy-demo-app.yml index 00d594e1..f13ae171 100644 --- a/.github/workflows/deploy-demo-app.yml +++ b/.github/workflows/deploy-demo-app.yml @@ -1,5 +1,5 @@ # Simple workflow for deploying static content to GitHub Pages -name: Deploy static content to Pages +name: Deploy playground to Pages on: # Runs on pushes targeting the default branch @@ -34,19 +34,19 @@ jobs: - name: Setup uses: ./.github/actions/step-setup - + - name: Setup Pages uses: actions/configure-pages@v5 - name: Build playground - run: npm run build:playground - + run: ORIGIN='https://jsverse.github.io/transloco/' npm run build:playground + - name: Upload artifact uses: actions/upload-pages-artifact@v3 with: # Upload entire repository path: 'dist/apps/transloco-playground' - + - name: Deploy to GitHub Pages id: deployment uses: actions/deploy-pages@v4 diff --git a/apps/transloco-playground/index-html-transform.ts b/apps/transloco-playground/index-html-transform.ts new file mode 100644 index 00000000..c955509d --- /dev/null +++ b/apps/transloco-playground/index-html-transform.ts @@ -0,0 +1,13 @@ +import { Target } from '@angular-devkit/architect'; +import * as cheerio from 'cheerio'; + +export default (_: Target, indexHtml: string) => { + if (!process.env.ORIGIN) { + return indexHtml; + } + + const $ = cheerio.load(indexHtml); + $('base').attr('href', process.env.ORIGIN); + + return $.html(); +}; diff --git a/apps/transloco-playground/project.json b/apps/transloco-playground/project.json index fd705cbc..a260e407 100644 --- a/apps/transloco-playground/project.json +++ b/apps/transloco-playground/project.json @@ -6,7 +6,7 @@ "prefix": "transloco-nx-shell", "targets": { "build": { - "executor": "@nx/angular:browser-esbuild", + "executor": "@nx/angular:webpack-browser", "outputs": ["{options.outputPath}"], "options": { "outputPath": "dist/apps/transloco-playground", @@ -36,6 +36,16 @@ ], "outputHashing": "all" }, + "docs": { + "fileReplacements": [ + { + "replace": "apps/transloco-playground/src/environments/environment.ts", + "with": "apps/transloco-playground/src/environments/environment.docs.ts" + } + ], + "indexHtmlTransformer": "apps/transloco-playground/index-html-transform.ts", + "outputHashing": "all" + }, "development": { "buildOptimizer": false, "optimization": false, diff --git a/apps/transloco-playground/src/app/app-src.directive.ts b/apps/transloco-playground/src/app/app-src.directive.ts new file mode 100644 index 00000000..6cbe5bb7 --- /dev/null +++ b/apps/transloco-playground/src/app/app-src.directive.ts @@ -0,0 +1,16 @@ +import { Directive, ElementRef, inject, input, OnInit } from '@angular/core'; + +import { environment } from '../environments/environment'; + +@Directive({ + selector: 'img[appSrc]', + standalone: true, +}) +export class AppSrcDirective implements OnInit { + host = inject(ElementRef).nativeElement as HTMLImageElement; + appSrc = input(); + + ngOnInit() { + this.host.src = `${environment.baseUrl}${this.appSrc()}`; + } +} diff --git a/apps/transloco-playground/src/app/app.component.html b/apps/transloco-playground/src/app/app.component.html index ba93c697..f3dd401f 100644 --- a/apps/transloco-playground/src/app/app.component.html +++ b/apps/transloco-playground/src/app/app.component.html @@ -5,7 +5,7 @@ target="_blank" href="https://jsverse.gitbook.io/transloco/" > - +