| .. | ||
| dist | ||
| LICENSE | ||
| package.json | ||
| README.md | ||
| sync.d.ts | ||
| types.d.ts | ||
| utils.d.ts | ||
Astro Compiler
Astro’s Go + WASM compiler.
Install
npm install @astrojs/compiler
Usage
Transform .astro to valid TypeScript
The Astro compiler can convert .astro syntax to a TypeScript Module whose default export generates HTML.
Some notes...
- TypeScript is valid
.astrosyntax! The output code may need an additional post-processing step to generate valid JavaScript. .astrofiles rely on a server implementation exposed asastro/runtime/server/index.jsin the Node ecosystem. Other runtimes currently need to bring their own rendering implementation and reference it viainternalURL. This is a pain point we're looking into fixing.
import { transform } from '@astrojs/compiler';
const result = await transform(source, {
filename: '/Users/astro/Code/project/src/pages/index.astro',
sourcemap: 'both',
internalURL: 'astro/runtime/server/index.js',
});
Parse .astro and return an AST
The Astro compiler can emit an AST using the parse method.
Some notes...
- Position data is currently incomplete and in some cases incorrect. We're working on it!
- A
TextNodecan represent both HTMLtextand JavaScript/TypeScript source code. - The
@astrojs/compiler/utilsentrypoint exposes awalkfunction that can be used to traverse the AST. It also exposes theishelper which can be used as guards to derive the proper types for eachnode.
import { parse } from '@astrojs/compiler';
import { walk, is } from '@astrojs/compiler/utils';
const result = await parse(source, {
position: false, // defaults to `true`
});
walk(result.ast, (node) => {
// `tag` nodes are `element` | `custom-element` | `component`
if (is.tag(node)) {
console.log(node.name);
}
});
Develop
VSCode / CodeSpaces
A devcontainer configuration is available for use with VSCode's Remote Development extension pack and GitHub CodeSpaces.