fix: cannot resolve linked refer message (#1549)

* docs: add build.transpile option

resolve #1546

* fix: cannot resolve linked refer message

Author: kazupon

packages/message-compiler/src/tokenizer.ts

@@ -28,6 +28,8 @@ const enum TokenChars {
   Pipe = '|',
   BraceLeft = '{',
   BraceRight = '}',
+  ParenLeft = '(',
+  ParenRight = ')',
   Modulo = '%',
   LinkedAlias = '@',
   LinkedDot = '.',
@@ -655,6 +657,8 @@ export function createTokenizer(
         ch === TokenChars.Modulo ||
         ch === TokenChars.LinkedAlias ||
         ch === TokenChars.Pipe ||
+        ch === TokenChars.ParenLeft ||
+        ch === TokenChars.ParenRight ||
         !ch
       ) {
         return buf
@@ -664,8 +668,6 @@ export function createTokenizer(
         buf += ch
         scnr.next()
         return fn(detect, buf)
-      } else if (!isIdentifierStart(ch)) {
-        return buf
       } else {
         buf += ch
         scnr.next()

packages/message-compiler/test/tokenizer/linked.test.ts

@@ -921,3 +921,38 @@ describe('errors', () => {
     ] as CompileError[])
   })
 })
+
+test('issue #1547', () => {
+  const tokenizer = createTokenizer('@:product.tc.howToUse.content1')
+  expect(tokenizer.nextToken()).toEqual({
+    type: TokenTypes.LinkedAlias,
+    value: '@',
+    loc: {
+      start: { line: 1, column: 1, offset: 0 },
+      end: { line: 1, column: 2, offset: 1 }
+    }
+  })
+  expect(tokenizer.nextToken()).toEqual({
+    type: TokenTypes.LinkedDelimiter,
+    value: ':',
+    loc: {
+      start: { line: 1, column: 2, offset: 1 },
+      end: { line: 1, column: 3, offset: 2 }
+    }
+  })
+  expect(tokenizer.nextToken()).toEqual({
+    type: TokenTypes.LinkedKey,
+    value: 'product.tc.howToUse.content1',
+    loc: {
+      start: { line: 1, column: 3, offset: 2 },
+      end: { line: 1, column: 31, offset: 30 }
+    }
+  })
+  expect(tokenizer.nextToken()).toEqual({
+    type: TokenTypes.EOF,
+    loc: {
+      start: { line: 1, column: 31, offset: 30 },
+      end: { line: 1, column: 31, offset: 30 }
+    }
+  })
+})

packages/vue-i18n-core/test/issues.test.ts

@@ -986,3 +986,38 @@ test('issue #1392', async () => {
 
   expect(wrapper.html()).toEqual(`<div> component: works<br> t: works</div>`)
 })
+
+test('issue #1547', async () => {
+  const i18n = createI18n({
+    legacy: false,
+    locale: 'en',
+    fallbackLocale: 'en',
+    messages: {
+      en: {
+        product: {
+          tc: {
+            howToUse: {
+              content1: 'Deep Linked message'
+            },
+            usage: {
+              content2: {
+                content: '@:product.tc.howToUse.content1'
+              }
+            }
+          }
+        }
+      }
+    }
+  })
+
+  const App = defineComponent({
+    setup() {
+      const { t } = useI18n()
+      return { t }
+    },
+    template: `<div>{{ t('product.tc.usage.content2.content') }}</div>`
+  })
+  const wrapper = await mount(App, i18n)
+
+  expect(wrapper.html()).toEqual('<div>Deep Linked message</div>')
+})