added: support typescript code

package.json

@@ -65,7 +65,6 @@
   "dependencies": {
     "@riotjs/parser": "^4.3.1",
     "@riotjs/util": "2.0.2",
-    "acorn": "^8.2.2",
     "cssesc": "^3.0.0",
     "cumpa": "^1.0.1",
     "curri": "^1.0.1",

src/generators/template/utils.js

@@ -101,9 +101,10 @@ function visitMemberExpression(path) {
  * @param   { types.NodePath } path - containing the current node visited
  * @returns { boolean } return false if we want to stop the tree traversal
  */
-function visitProperty(path) {
+function visitObjectProperty(path) {
   const value = path.node.value
   const isShorthand = path.node.shorthand
+
   if (isIdentifier(value) || isMemberExpression(value) || isShorthand) {
     // disable shorthand object properties
     if (isShorthand) path.node.shorthand = false
@@ -152,7 +153,7 @@ export function updateNodesScope(ast) {
   types.visit(ast, {
     visitIdentifier,
     visitMemberExpression,
-    visitProperty,
+    visitObjectProperty,
     visitThisExpression,
     visitClassExpression: ignorePath
   })

src/utils/ast-nodes-checks.js

@@ -7,19 +7,15 @@ const builtinAPIs = Object.keys(globalScope.builtin)
 export const isIdentifier = n => namedTypes.Identifier.check(n)
 export const isLiteral = n => namedTypes.Literal.check(n)
 export const isExpressionStatement = n => namedTypes.ExpressionStatement.check(n)
-export const isObjectExpression = n => namedTypes.ObjectExpression.check(n)
 export const isThisExpression = n => namedTypes.ThisExpression.check(n)
 export const isThisExpressionStatement = n =>
   isExpressionStatement(n) &&
   isMemberExpression(n.expression.left) &&
   isThisExpression(n.expression.left.object)
 export const isNewExpression = n => namedTypes.NewExpression.check(n)
 export const isSequenceExpression = n => namedTypes.SequenceExpression.check(n)
-export const isBinaryExpression = n => namedTypes.BinaryExpression.check(n)
-export const isUnaryExpression = n => namedTypes.UnaryExpression.check(n)
 export const isExportDefaultStatement = n => namedTypes.ExportDefaultDeclaration.check(n)
 export const isMemberExpression = n => namedTypes.MemberExpression.check(n)
-export const isArrayExpression = n => namedTypes.ArrayExpression.check(n)
 export const isImportDeclaration = n => namedTypes.ImportDeclaration.check(n)
 
 export const isBrowserAPI = ({name}) => browserAPIs.includes(name)

src/utils/generate-ast.js

@@ -1,6 +1,5 @@
-import {Parser} from 'acorn'
+import {parse as customParser} from 'recast/parsers/babel'
 import {parse} from 'recast'
-
 /**
  * Parse a js source to generate the AST
  * @param   {string} source - javascript source
@@ -9,14 +8,7 @@ import {parse} from 'recast'
  */
 export default function generateAST(source, options) {
   return parse(source, {
-    parser: {
-      parse(source, opts) {
-        return Parser.parse(source, {
-          ...opts,
-          ecmaVersion: 2020
-        })
-      }
-    },
+    parser: { parse: customParser },
     ...options
   })
 }

test/generators/javascript.spec.js

@@ -65,6 +65,21 @@ export default {
 </script>
 `
 
+const typescriptCode = `
+<script>
+let internalVar:string = 'internalVar'
+
+const name: string = 'hello';
+
+const method = ():number => 3
+
+export default {
+  
+}
+
+</script>
+`
+
 const simpleContextMapping = `
 <script>
 const ctx = this
@@ -145,4 +160,19 @@ describe('Generators - javascript', () => {
     expect(output.default.css).to.be.not.ok
     expect(output.default.template).to.be.not.ok
   })
+
+  it('Typescript code can be properly parsed', () => {
+    const { javascript } = parser().parse(typescriptCode).output
+    const ast = compileJavascript(javascript, typescriptCode, {
+      options: {
+        file: FAKE_FILE
+      }
+    }, createInput())
+    const { code } = print(ast)
+
+    expect(code).to.be.a('string')
+
+    expect(code).to.match(/:number/)
+    expect(code).to.match(/:string/)
+  })
 })