|
| 1 | +## Working with ASTs |
| 2 | + |
| 3 | +### 1 edit the fixture |
| 4 | + |
| 5 | +edit `./scripts/fixture.ts`, for example: |
| 6 | + |
| 7 | +```js |
| 8 | +// ./scripts/fixture.ts |
| 9 | +export interface InstantiateMsg { |
| 10 | + admin?: string | null; |
| 11 | + members: Member[]; |
| 12 | +} |
| 13 | +``` |
| 14 | + |
| 15 | +### 2 run AST generator |
| 16 | + |
| 17 | +``` |
| 18 | +yarn test:ast |
| 19 | +``` |
| 20 | + |
| 21 | +### 3 look at the JSON produced |
| 22 | + |
| 23 | +``` |
| 24 | +code ./scripts/test-output.json |
| 25 | +``` |
| 26 | + |
| 27 | +We use the npm module `ast-stringify` to strip out unnecessary props, and generate a JSON for reference. |
| 28 | + |
| 29 | +You will see a `File` and `Program`... only concern yourself with the `body[]`: |
| 30 | + |
| 31 | +```json |
| 32 | +{ |
| 33 | + "type": "File", |
| 34 | + "errors": [], |
| 35 | + "program": { |
| 36 | + "type": "Program", |
| 37 | + "sourceType": "module", |
| 38 | + "interpreter": null, |
| 39 | + "body": [ |
| 40 | + { |
| 41 | + "type": "ExportNamedDeclaration", |
| 42 | + "exportKind": "type", |
| 43 | + "specifiers": [], |
| 44 | + "source": null, |
| 45 | + "declaration": { |
| 46 | + "type": "TSInterfaceDeclaration", |
| 47 | + "id": { |
| 48 | + "type": "Identifier", |
| 49 | + "name": "InstantiateMsg" |
| 50 | + }, |
| 51 | + "body": { |
| 52 | + "type": "TSInterfaceBody", |
| 53 | + "body": [ |
| 54 | + { |
| 55 | + "type": "TSPropertySignature", |
| 56 | + "key": { |
| 57 | + "type": "Identifier", |
| 58 | + "name": "admin" |
| 59 | + }, |
| 60 | + "computed": false, |
| 61 | + "optional": true, |
| 62 | + "typeAnnotation": { |
| 63 | + "type": "TSTypeAnnotation", |
| 64 | + "typeAnnotation": { |
| 65 | + "type": "TSUnionType", |
| 66 | + "types": [ |
| 67 | + { |
| 68 | + "type": "TSStringKeyword" |
| 69 | + }, |
| 70 | + { |
| 71 | + "type": "TSNullKeyword" |
| 72 | + } |
| 73 | + ] |
| 74 | + } |
| 75 | + } |
| 76 | + }, |
| 77 | + { |
| 78 | + "type": "TSPropertySignature", |
| 79 | + "key": { |
| 80 | + "type": "Identifier", |
| 81 | + "name": "members" |
| 82 | + }, |
| 83 | + "computed": false, |
| 84 | + "typeAnnotation": { |
| 85 | + "type": "TSTypeAnnotation", |
| 86 | + "typeAnnotation": { |
| 87 | + "type": "TSArrayType", |
| 88 | + "elementType": { |
| 89 | + "type": "TSTypeReference", |
| 90 | + "typeName": { |
| 91 | + "type": "Identifier", |
| 92 | + "name": "Member" |
| 93 | + } |
| 94 | + } |
| 95 | + } |
| 96 | + } |
| 97 | + } |
| 98 | + ] |
| 99 | + } |
| 100 | + } |
| 101 | + } |
| 102 | + ], |
| 103 | + "directives": [] |
| 104 | + }, |
| 105 | + "comments": [] |
| 106 | +} |
| 107 | +``` |
| 108 | + |
| 109 | +### 4 code with `@babel/types` using the JSON as a reference |
| 110 | + |
| 111 | +NOTE: 4 continued ideally you should be writing a test with your generator! |
| 112 | + |
| 113 | +```js |
| 114 | +import * as t from '@babel/types'; |
| 115 | + |
| 116 | +export const createNewGenerator = () => { |
| 117 | + return t.exportNamedDeclaration( |
| 118 | + t.tsInterfaceDeclaration( |
| 119 | + t.identifier('InstantiateMsg'), |
| 120 | + null, |
| 121 | + [], |
| 122 | + t.tsInterfaceBody([ |
| 123 | + // ... more code ... |
| 124 | + ]) |
| 125 | + ) |
| 126 | + ); |
| 127 | +}; |
| 128 | +``` |
0 commit comments