Este bundle genera complementeos para usar en TypeScript, basados en un proyecto symfony.
composer require irontec/typescript-generator-bundle
PHP >=7.4
Generate Interface Generate Package Generate All
Este funcionalidad consiste, en crear interfaces de TypeScript basandose clases PHP pensadas en funcionar como entidades de doctrine.
Estas interfaces se crean teniendo en cuenta las propiedades de estas clases. Como tal se tiene 3 formas de obtener el tipo de cada propiedad.
- Definición del tipado de la propiedad fuerte, disponible desde PHP 7.4
-
private int $id;
-
- Definición del tipado de la propiedad, en el comentario de esta
-
@var int
-
- Definición del tipado de la propiedad, en anotaciones de doctrine
-
@ORM\Column(type="integer")
-
En caso de no encontrar un tipo, se generara la interface con el tipo "unknown".
La generación de interfaces se hace ejecutando el siguiente comando:
bin/console typescript:generate:interface output-dir [entities-dir]
Este comando acepta 2 parametros, los cuales uno es obligatorio y otro opcional.
output-dir [Obligatorio]: Directorio donde se crearan las interfaces entities-dir [Opcional]: Directorio de las entidades que se usaran para generar las interfaces. Por defecto se busca en "src/Entity/"
Para volver una entidad en una interface, es necesario escribir el comentario "#TypeScriptMe" en la definición de la clase, Ejemplo:
<?php
namespace App\Entity;
...
/**
* #TypeScriptMe
* @ORM\Entity(repositoryClass="App\Repository\UserRepository")
*/
class User
{
...
Listado de tipados soportados:
TypeScript | PHP/Doctrine |
---|---|
number | int - integer - smallint - bigint - decimal - float |
string | string - text - guid - date - time - datetime - datetimetz |
boolean | boolean |
interface | Interface de una interface relacionada en un uno a uno |
interface[] | Array de interfaces, en una relación uno a muchos |
unknown | Cuando no es ninguna de las anteriores |
Si se usan las anotaciones de dotrine y se tiene definido "nullable=true" o en el tipado fuerte de la propiedad esta definido el ? antes del tipo, se aplica el ? despues del nombre de la propiedad, que se interpreta como un parametro optativo.
Entidad en PHP y con anotaciones.
// src/Entity/User.php
<?php
namespace App\Entity;
/**
* #TypeScriptMe
* @ORM\Table(name="user")
*/
class User
{
/**
* @ORM\Id
* @ORM\GeneratedValue
* @ORM\Column(type="integer")
* @var int
*/
private int $id;
/**
* @ORM\Column(type="string", length=100)
* @var string
*/
private $name;
/**
* @ORM\Column(type="string", length=100, nullable=true)
*/
private $lastname;
/**
* @ORM\OneToMany(targetEntity="Factory", mappedBy="author")
*/
private \Doctrine\Common\Collections\Collection $factories;
/**
* @ORM\OneToOne(targetEntity="Photo", mappedBy="user")
*/
private $photo;
....
Interface de TypeScript generada
// interfaces/User.ts
export interface User {
id: number,
name: string,
lastname?: string,
enabled: boolean,
photo: Photo,
factories: Factory[]
}
Para facilitar el uso de las interfaces, se general el fichero "models.d.ts" en el que se hace el export de todas las interfaces.
// interfaces/models.d.ts
export * from './User';
export * from './Photo';
export * from './Factory';
bin/console typescript:generate:package output-dir [package-name] [version]
Con este comando se genera un fichero package.json con los datos básicos para publicar en un reposiorio privado de npm.
Cada vez que se ejecute el generador de package, por defecto se actualiza la versión "Patch" de este, con la opción de pasar una versión en concreto o subir de "patch", "minor" o "major".
Ejemplo del package.json que se genera:
// interfaces/package.json
{
"name": "@irontec/example",
"version": "0.0.1",
"description": "typescript interfaces for @irontec/example project",
"types": "models.d.ts",
"keywords": [],
"author": "",
"license": "EUPL"
}
bin/console typescript:generate:all output-dir [entities-dir] [package-name] [version]
Ejecuta los comandos anteriores.
Para publicar en un repositorio privado, es necesario generar previamente el fichero package.json y tener instalado npm
- Iniciar sesión en NPM
npm adduser --registry https://npm.example.com
- Publicar/Actualizar los cambios en las interfaces
npm publish --registry https://npm.example.com