fix(vue-extractor): don't crash when there is no <template> in an SFC (…

…#1623)

packages/extractor-vue/src/__snapshots__/extractor.test.ts.snap

@@ -1,5 +1,21 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`vue extractor should extract message from functional component 1`] = `
+[
+  {
+    comment: undefined,
+    context: undefined,
+    id: Render function message,
+    message: undefined,
+    origin: [
+      functional.vue,
+      10,
+      33,
+    ],
+  },
+]
+`;
+
 exports[`vue extractor should extract message from vue file 1`] = `
 [
   {

packages/extractor-vue/src/extractor.test.ts

@@ -61,4 +61,26 @@ describe("vue extractor", () => {
 
     expect(messages).toMatchSnapshot()
   })
+
+  it("should extract message from functional component", async () => {
+    const filePath = path.resolve(__dirname, "fixtures/functional.vue")
+    const code = fs.readFileSync(filePath, "utf-8")
+
+    let messages: ExtractedMessage[] = []
+
+    await vueExtractor.extract(
+      "functional.vue",
+      code,
+      (res) => {
+        messages.push(res)
+      },
+      {
+        linguiConfig,
+      }
+    )
+
+    messages = normalizePath(messages)
+
+    expect(messages).toMatchSnapshot()
+  })
 })

packages/extractor-vue/src/fixtures/functional.vue

@@ -0,0 +1,12 @@
+<script lang="ts">
+import { defineComponent } from "vue"
+import { i18n } from "@lingui/core"
+
+// @ts-ignore only used to check if extractor doesn't crash with Typescript
+const foo: number = 5
+
+export default defineComponent({
+  render(createElement) {
+    return createElement('div', [i18n._("Render function message")])
+  }})
+</script>

packages/extractor-vue/src/vue-extractor.ts

@@ -18,12 +18,14 @@ export const vueExtractor: ExtractorType = {
       ignoreEmpty: true,
     })
 
-    const compiledTemplate = compileTemplate({
-      source: descriptor.template.content,
-      filename,
-      inMap: descriptor.template.map,
-      id: filename,
-    })
+    const compiledTemplate =
+      descriptor.template &&
+      compileTemplate({
+        source: descriptor.template.content,
+        filename,
+        inMap: descriptor.template.map,
+        id: filename,
+      })
 
     const isTsBlock = (block: SFCBlock) => block?.lang === "ts"