README

描述

此symfony框架扩展提供了一个生成器，在将提供的扩展注册到您的symfony应用程序后，可以在代码中使用该生成器生成typescript代码。这些生成的路由可以用于typescript代码中引用symfony应用程序的路由。

安装

composer require bolzer/symfony-typescript-routes

示例

1. 注册扩展

// bundles.php
<?php

return [
    Bolzer\SymfonyTypescriptRoutes\Bundle\TypescriptPathBundle::class => ['all' => true],
];

1. 写入一些内容以创建一个包含服务内容的path.ts文件。就像一个命令！

// some_command.php
<?php

use Bolzer\SymfonyTypescriptRoutes\Service\GeneratorService;
use Symfony\Component\Console\Command\Command;
use Symfony\Component\Console\Input\InputInterface;
use Symfony\Component\Console\Output\OutputInterface;
use Bolzer\SymfonyTypescriptRoutes\Dto\GeneratorConfig;

class GenerationCommand extends Command
{
    public function __construct(
        private GeneratorService $generatorService,
    ){}

      protected function configure(): void
    {
        $this->setName('generate_paths');
    }

    protected function execute(InputInterface $input, OutputInterface $output): int
    {
       // Typescript routes containing relative and absolute urls.
       $routes = $this->generatorService->generate(GeneratorConfig::generateEverything());
       
       // Typescript routes containing absolute urls.
       $routes = $this->generatorService->generate(GeneratorConfig::generateOnlyAbsoluteUrls());
       
       // Typescript routes containing absolute urls.
       $routes = $this->generatorService->generate(GeneratorConfig::generateOnlyRelativeUrls());
    
       file_put_contents(__DIR__ . '../../../paths.ts', implode("\n", $routes));
       $output->writeln('<comment>Generation of paths done.</comment>');
       
       return Command::SUCCESS;
    }
}

输出可能如下所示

//paths.ts
const rRP = (rawRoute: string, routeParams: Record<string, string>): string => {Object.entries(routeParams).forEach(([key, value]) => rawRoute = rawRoute.replace(`{${key}}`, value)); return rawRoute;}
const aQP = (route: string, queryParams?: Record<string, string>): string => queryParams ? route + "?" + new URLSearchParams(queryParams).toString() : route;
export const path_user_route = ():{ relative: (routeParams: {id: string, noteId: string}, queryParams?: Record<string, string>) => string, absolute: (routeParams: {id: string, noteId: string}, queryParams?: Record<string, string>) => string} => {return {relative: (routeParams: {id: string, noteId: string}, queryParams?: Record<string, string>): string => aQP(rRP('/user/{id}/notes/{noteId}', routeParams), queryParams), absolute: (routeParams: {id: string, noteId: string}, queryParams?: Record<string, string>): string => aQP(rRP('https://app.development.org/user/{id}/notes/{noteId}', routeParams), queryParams)}};

可以使用这种方式

//example.ts
import * as $ from "jquery";
import {path_users_route} from "./paths";

$.get(path_users_route().relative({"count": "20"}))

// Outputs: /users?count=20
console.log(path_users_route().relative(({"count": "20"})))

// Outputs: https://example.host.org/users?count=20
console.log(path_users_route().absolute(({"count": "20"})))

约定

• 如果路由中没有定义要求，查询和路由参数必须作为字符串提供给typescript函数。仅支持数字要求和A或B要求。
• 所有生成的typescript路径函数都将有"path_"前缀。

执行测试

docker build -t ts-path-tests .
docker run ts-path-tests

测试覆盖率

XDEBUG_MODE=coverage ./vendor/bin/phpunit --coverage-text