switched to the public shared packages
This commit is contained in:
43
README.md
43
README.md
@@ -2,7 +2,7 @@
|
||||
|
||||
> [Deutsche Version](README.DE.md)
|
||||
|
||||
Example project showing how to build a **PHX ERP frontend plugin** as an Angular web component, using `@phx/shared` and `@phx/shared-ui`.
|
||||
Example project showing how to build a **PHX ERP frontend plugin** as an Angular web component, using `@phx-erp/shared` and `@phx-erp/shared-ui`.
|
||||
|
||||
The same codebase supports two workflows:
|
||||
|
||||
@@ -67,7 +67,6 @@ A PHX frontend plugin is an Angular application packaged as a **custom element**
|
||||
- [Node.js](https://nodejs.org/) (LTS recommended)
|
||||
- [Yarn v4](https://yarnpkg.com/getting-started/install)
|
||||
- A running PHX instance (for plugin-host testing and GraphQL schema/codegen)
|
||||
- An **npm access token** with read access to PHXGMBH packages — request one at your PHX partner
|
||||
|
||||
For local standalone development you also need either:
|
||||
|
||||
@@ -78,15 +77,13 @@ For local standalone development you also need either:
|
||||
|
||||
## Quick start
|
||||
|
||||
1. **Configure Yarn** to access the PHX npm registry (see [PHX libraries](#5-phx-libraries)). Do not commit `.yarnrc.yml`.
|
||||
|
||||
2. **Install dependencies:**
|
||||
1. **Install dependencies:**
|
||||
|
||||
```bash
|
||||
yarn install
|
||||
```
|
||||
|
||||
3. **Create a local development environment** (optional, for standalone mode):
|
||||
2. **Create a local development environment** (optional, for standalone mode):
|
||||
|
||||
```bash
|
||||
cp src/environments/environment.example.ts src/environments/environment.development.ts
|
||||
@@ -94,13 +91,13 @@ For local standalone development you also need either:
|
||||
|
||||
Adjust `apiUrl`, `wsUrl`, and optionally `apiKey` in that file. The file is gitignored.
|
||||
|
||||
4. **Generate GraphQL types** (requires PHX admin API at the schema URL configured in `codegen.ts`):
|
||||
3. **Generate GraphQL types** (requires PHX admin API at the schema URL configured in `codegen.ts`):
|
||||
|
||||
```bash
|
||||
yarn codegen
|
||||
```
|
||||
|
||||
5. **Run in one of the development modes** below.
|
||||
4. **Run in one of the development modes** below.
|
||||
|
||||
---
|
||||
|
||||
@@ -367,24 +364,12 @@ Add `fileReplacements` to the **development** build configuration in `angular.js
|
||||
|
||||
### 5. PHX libraries
|
||||
|
||||
`@phx/shared` and `@phx/shared-ui` are published on the PHXGMBH npm registry.
|
||||
`@phx-erp/shared` and `@phx-erp/shared-ui` are published on the public npm registry.
|
||||
|
||||
Create `.yarnrc.yml` in the project root (or edit `~/.yarnrc.yml` for a global setup):
|
||||
|
||||
```yml
|
||||
nodeLinker: node-modules
|
||||
npmScopes:
|
||||
phx:
|
||||
npmRegistryServer: "https://gitea.phx-erp.de/api/packages/PHXGMBH/npm/"
|
||||
npmAuthToken: "*YOUR-TOKEN*"
|
||||
```
|
||||
|
||||
> **Important:** Add `.yarnrc.yml` to `.gitignore` if it contains your token.
|
||||
|
||||
Then install the libraries:
|
||||
Install the libraries:
|
||||
|
||||
```bash
|
||||
yarn add @phx/shared @phx/shared-ui
|
||||
yarn add @phx-erp/shared @phx-erp/shared-ui
|
||||
```
|
||||
|
||||
### 6. Plugin setup
|
||||
@@ -396,7 +381,7 @@ Add `providePhoenixPluginWithPrimeNG` in `src/app/app.config.ts`:
|
||||
```ts
|
||||
import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
|
||||
import { provideRouter } from '@angular/router';
|
||||
import { providePhoenixPluginWithPrimeNG } from '@phx/shared-ui';
|
||||
import { providePhoenixPluginWithPrimeNG } from '@phx-erp/shared-ui';
|
||||
import { routes } from './app.routes';
|
||||
|
||||
export const appConfig: ApplicationConfig = {
|
||||
@@ -424,7 +409,7 @@ Create `src/app/services/phoenix-host-bridge.service.ts`:
|
||||
|
||||
```ts
|
||||
import { Injectable, Injector, signal } from '@angular/core';
|
||||
import type { IPluginServices } from '@phx/shared-ui';
|
||||
import type { IPluginServices } from '@phx-erp/shared-ui';
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class PhoenixHostBridgeService {
|
||||
@@ -459,7 +444,7 @@ Your root component receives `pluginServices` and `hostInjector` from PHX and fo
|
||||
import { Component, effect, inject, Injector, input } from '@angular/core';
|
||||
import { RouterOutlet } from '@angular/router';
|
||||
import { PhoenixHostBridgeService } from './services/phoenix-host-bridge.service';
|
||||
import { IPluginServices, syncPhoenixHostInjector } from '@phx/shared-ui';
|
||||
import { IPluginServices, syncPhoenixHostInjector } from '@phx-erp/shared-ui';
|
||||
|
||||
@Component({
|
||||
selector: 'app-root',
|
||||
@@ -492,7 +477,7 @@ In `src/main.ts`, register your plugin as a custom element (replace `*YOUR-TAG*`
|
||||
```ts
|
||||
import { appConfig } from './app/app.config';
|
||||
import { App } from './app/app';
|
||||
import { bootstrapPhoenixPluginCustomElement } from '@phx/shared-ui';
|
||||
import { bootstrapPhoenixPluginCustomElement } from '@phx-erp/shared-ui';
|
||||
import { environment } from './environments/environment';
|
||||
|
||||
bootstrapPhoenixPluginCustomElement(App, '*YOUR-TAG*', appConfig).then((app) => {
|
||||
@@ -764,7 +749,7 @@ This repository additionally runs `copy-latest.mjs` alongside `build` to publish
|
||||
|---------|-----------------|
|
||||
| PHX shows an old version of the plugin | Hard-refresh; confirm `serve.json` sets `Cache-Control: no-store` for JS; restart `yarn run plugin` |
|
||||
| `401` / GraphQL auth errors in standalone mode | Set `apiKey` in `environment.development.ts` or log in via `/login` |
|
||||
| `yarn add @phx/shared` fails | Verify `.yarnrc.yml` token; contact your PHX partner |
|
||||
| `yarn add @phx-erp/shared` fails | Check network access to the public npm registry; retry `yarn install` |
|
||||
| Routing broken inside PHX | Add route segments to `stripTrailingSegments` in `providePhoenixPluginWithPrimeNG` |
|
||||
| Tailwind classes missing in a component | Add `@tailwind` directives to that component's `styles` |
|
||||
| `yarn codegen` fails | Ensure PHX is running and the schema URL in `codegen.ts` is reachable |
|
||||
@@ -774,4 +759,4 @@ This repository additionally runs `copy-latest.mjs` alongside `build` to publish
|
||||
|
||||
## Support
|
||||
|
||||
For registry access, integration questions, or PHX-specific APIs, contact your PHX partner.
|
||||
For integration questions or PHX-specific APIs, contact your PHX partner.
|
||||
|
||||
Reference in New Issue
Block a user