TypeScript support (#5)
This makes it so that setup scripts are treated as TypeScript.
This commit is contained in:
parent
588b086a4d
commit
0932401433
1 changed files with 30 additions and 7 deletions
|
@ -153,11 +153,39 @@ function getComponentWrapper(_name: string, { type, url }: { type: string; url:
|
||||||
throw new Error('Unknown Component Type: ' + name);
|
throw new Error('Unknown Component Type: ' + name);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const patternImport = new RegExp(/import(?:["'\s]*([\w*${}\n\r\t, ]+)from\s*)?["'\s]["'\s](.*[@\w_-]+)["'\s].*;$/, 'mg');
|
||||||
|
function compileScriptSafe(raw: string, loader:'jsx' | 'tsx'): string {
|
||||||
|
// esbuild treeshakes unused imports. In our case these are components, so let's keep them.
|
||||||
|
const imports: Array<string> = [];
|
||||||
|
raw.replace(patternImport, (value: string) => {
|
||||||
|
imports.push(value);
|
||||||
|
return value;
|
||||||
|
})
|
||||||
|
|
||||||
|
let { code } = transformSync(raw, {
|
||||||
|
loader,
|
||||||
|
jsxFactory: 'h',
|
||||||
|
jsxFragment: 'Fragment',
|
||||||
|
charset: 'utf8',
|
||||||
|
});
|
||||||
|
|
||||||
|
for(let importStatement of imports) {
|
||||||
|
if(!code.includes(importStatement)) {
|
||||||
|
code = importStatement + '\n' + code;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return code;
|
||||||
|
}
|
||||||
|
|
||||||
async function convertHmxToJsx(template: string, compileOptions: CompileOptions) {
|
async function convertHmxToJsx(template: string, compileOptions: CompileOptions) {
|
||||||
await eslexer.init;
|
await eslexer.init;
|
||||||
|
|
||||||
const ast = parse(template, {});
|
const ast = parse(template, {});
|
||||||
const script = ast.instance ? ast.instance.content : "";
|
const script = compileScriptSafe(ast.instance ? ast.instance.content : "", 'tsx');
|
||||||
|
|
||||||
|
// Compile scripts as TypeScript, always
|
||||||
|
|
||||||
// Todo: Validate that `h` and `Fragment` aren't defined in the script
|
// Todo: Validate that `h` and `Fragment` aren't defined in the script
|
||||||
|
|
||||||
const [scriptImports] = eslexer.parse(script, 'optional-sourcename');
|
const [scriptImports] = eslexer.parse(script, 'optional-sourcename');
|
||||||
|
@ -182,12 +210,7 @@ async function convertHmxToJsx(template: string, compileOptions: CompileOptions)
|
||||||
// console.log("enter", node.type);
|
// console.log("enter", node.type);
|
||||||
switch (node.type) {
|
switch (node.type) {
|
||||||
case 'MustacheTag':
|
case 'MustacheTag':
|
||||||
let { code } = transformSync(node.expression, {
|
let code = compileScriptSafe(node.expression, 'jsx');
|
||||||
loader: 'jsx',
|
|
||||||
jsxFactory: 'h',
|
|
||||||
jsxFragment: 'Fragment',
|
|
||||||
charset: 'utf8',
|
|
||||||
});
|
|
||||||
|
|
||||||
let matches: RegExpExecArray[] = [];
|
let matches: RegExpExecArray[] = [];
|
||||||
let match: RegExpExecArray | null | undefined;
|
let match: RegExpExecArray | null | undefined;
|
||||||
|
|
Loading…
Reference in a new issue