Skip to content

Commit

Permalink
fix: adjust the help documentation for the transpiler
Browse files Browse the repository at this point in the history
  • Loading branch information
yilun.sun committed Mar 7, 2024
1 parent 59ab029 commit c734db6
Showing 1 changed file with 17 additions and 21 deletions.
38 changes: 17 additions & 21 deletions src/phpdoc-parser/transpiler/README.md
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
# How to Use the PHPDoc Parser Transpiler

This document provides a guide on how to use the PHPDoc Parser Transpiler to convert PHPDoc comments into TypeScript type annotations. We'll go through a example demonstrating how to set up and execute the transpilation process.
This document provides a guide on how to use the PHPDoc Parser Transpiler to convert PHPDoc comments into TypeScript type definitions. We'll go through a example demonstrating how to set up and execute the transpilation process.

## Setting Up the Environment

Before you begin, ensure you have a TypeScript project setup where you can run the example code. Your project should include the necessary files and dependencies related to the PHPDoc Parser and the transpiler.
Before you begin, ensure you have a TypeScript project setup where you can run the example code. Your project should include the necessary files and dependencies related to the PHPDoc Parser.

## Example Code Overview

Expand All @@ -13,22 +13,22 @@ The example provided demonstrates how to parse a PHPDoc comment, extract node in
1. **Tokenization**: Convert a PHPDoc comment string into tokens.
2. **Parsing**: Transform the tokens into an Abstract Syntax Tree (AST) representing the PHPDoc structure.
3. **Transpilation**: Convert the PHPDoc AST nodes into TypeScript type nodes.
4. **Rendering**: Convert the TypeScript nodes into strings representing TypeScript type annotations.
4. **Rendering**: Convert the TypeScript nodes into strings representing TypeScript type definitions.

## Step 1: Import Necessary Classes and Types

```TypeScript
import { renderTsNodeToString } from './helpers';
import { PHPDocTypeNodeToTypescriptTypeNodeTranspiler } from './php-doc-to-typescript-type-transpiler';
import { PhpDocTypeNodeToTypescriptTypeNodeTranspiler } from './php-doc-to-typescript-type-transpiler';
import type { ParamTagValueNode, PropertyTagValueNode, ReturnTagValueNode } from '../ast/php-doc';
import { Lexer, ConstExprParser, PHPDocParser, TokenIterator, TypeParser } from '../lexer/parser';
import { Lexer, ConstExprParser, PhpDocParser, TokenIterator, TypeParser } from '../lexer/parser';
```

## Step 2: Define a Custom Transpiler Class

```TypeScript
class ExtendedTranspiler extends PHPDocTypeNodeToTypescriptTypeNodeTranspiler {
public isSnakeCase: boolean = true;
class ExtendedTranspiler extends PhpDocTypeNodeToTypescriptTypeNodeTranspiler {
public customProperty: boolean = true;

constructor(public resolver: NameNodePathResolver<ExtendedTranspiler>) {
super((nodeParts: string[]) => resolver.call(this, nodeParts) as {
Expand All @@ -40,7 +40,7 @@ class ExtendedTranspiler extends PHPDocTypeNodeToTypescriptTypeNodeTranspiler {
}
```

By extending the `PHPDocTypeNodeToTypescriptTypeNodeTranspiler` class to create a custom `ExtendedTranspiler` class, you gain the flexibility to add custom properties like `isSnakeCase`. This allows you to tailor the transpiler's behavior to your project's needs. For example, the `isSnakeCase` property can be used to determine how names are transformed or resolved within the `NameNodePathResolver`, catering to specific naming conventions with ease.
By extending the `PhpDocTypeNodeToTypescriptTypeNodeTranspiler` class to create a custom `ExtendedTranspiler` class, you gain the flexibility to add custom properties like `customProperty`. This allows you to tailor the transpiler's behavior to your project's needs. For example, the `customProperty` property can be used to determine how names are transformed or resolved within the `NameNodePathResolver`, catering to specific naming conventions with ease.

## Step 3: Parse the PHPDoc Comment

Expand All @@ -50,20 +50,16 @@ const transpileCommentText = (commentText: string) => {
const lexer = new Lexer();
const constExprParser = new ConstExprParser();
const typeParser = new TypeParser(constExprParser);
const PHPDocParser = new PHPDocParser(typeParser, constExprParser);
const phpDocParser = new PhpDocParser(typeParser, constExprParser);

// Tokenize and parse the PHPDoc comment to create the AST.
const tokens = new TokenIterator(lexer.tokenize(commentText));
const astRootNode = PHPDocParser.parse(tokens); // Produces a PHPDocNode
const astRootNode = phpDocParser.parse(tokens); // Produces a PHPDocNode

// Extract property, return, or parameter nodes from the AST.
const propertyTagValueNodes = astRootNode
.getTags()
.map((node) => node.value) as (
| PropertyTagValueNode
| ReturnTagValueNode
| ParamTagValueNode
)[];
.map((node) => node.value)

return propertyTagValueNodes;
};
Expand All @@ -73,7 +69,7 @@ const transpileCommentText = (commentText: string) => {

```TypeScript
const commentText = `/**
* @property-read array|null $person
* @property-read array|null $person
*/`;

// Parse the PHPDoc comment text to get node structures.
Expand All @@ -82,7 +78,7 @@ const tsTypeNode = transpileCommentText(commentText);
// Define a resolver function for path resolving in the transpiler.
const nameNodePathResolver: NameNodePathResolver<ExtendedTranspiler> =
function (this: ExtendedTranspiler, nodeParts: string[]) {
console.log(nodeParts, this.isSnakeCase);
console.log(nodeParts, this.customProperty);

return {
name: '',
Expand All @@ -94,17 +90,17 @@ const nameNodePathResolver: NameNodePathResolver<ExtendedTranspiler> =
// Map through the nodes, transpile each, and render to TypeScript type strings.
tsTypeNode.map((node) => {
const transpiler = new ExtendedTranspiler(nameNodePathResolver);
transpiler.isSnakeCase = false; // Set your configurations
transpiler.beforeTranspile(); // Initialize transpilation state
transpiler.customProperty = 'this is a custom property'; // Set your configurations
transpiler.beforeTranspile(); // Initialize transpilation state(reset the state of importDeclarations)
const transpiledNode = transpiler.transpile(node.type); // Transpile the node

// Render the TypeScript node to a string
return renderTsNodeToString(transpiledNode);
});
```

The `nameNodePathResolver` function is defined as a `NameNodePathResolver` for the `ExtendedTranspiler` class. Within this function, by using the `this` keyword typed as `ExtendedTranspiler`, it gains direct access to properties and methods of `ExtendedTranspiler`, including the custom property `isSnakeCase`.
The `nameNodePathResolver` function is defined as a `NameNodePathResolver` for the `ExtendedTranspiler` class. Within this function, by using the `this` keyword typed as `ExtendedTranspiler`, it gains direct access to properties and methods of `ExtendedTranspiler`, including the custom property `customProperty`.

## Conclusion

This guide presented a simplistic way to bridge PHPDoc comments and TypeScript type annotations using a transpiler. By parsing, transpiling, and rendering, you can automate the conversion of types from PHP to TypeScript, enhancing interoperability between the two languages in your project.
This guide presented a simplistic way to bridge PHPDoc comments and TypeScript type definitions using a transpiler. By parsing, transpiling, and rendering, you can automate the conversion of types from PHP to TypeScript, enhancing interoperability between the two languages in your project.

0 comments on commit c734db6

Please sign in to comment.