Add support for locale attribute on i18n block

src/process.ts

@@ -53,29 +53,35 @@ export default function process ({ blocks, vueOptionsNamespace, filename }: Proc
  */
 function parseI18nBlockToJSON (block: SFCCustomBlock, filename: string): string {
   const lang = block.attrs && block.attrs.lang
+  const locale = block.attrs && block.attrs.locale
   const src = block.attrs && block.attrs.src
   const content = src
     ? readFileSync(getAbsolutePath(src, filename)).toString()
     : block.content
 
-  return convertToJSON(content, lang)
+  return convertToJSON(content, lang, locale)
 }
 
 /**
  * Convert JSON/YAML/JSON5 to minified JSON string.
  * @param source JSON/YAML/JSON5 encoded string
  * @param lang Language used in `source`. Supported JSON, YAML or JSON5.
+ * @param locale Attribute "locale" on <i18n> block will be added.
  * @returns {string} A minified JSON string
  */
-function convertToJSON (source: string, lang: string): string {
+function convertToJSON (source: string, lang: string, locale: string): string {
+  const stringify = locale
+    ? (parseResult: any) => JSON.stringify({ [locale]: parseResult })
+    : JSON.stringify
+
   switch (lang) {
     case 'yaml':
     case 'yml':
-      return JSON.stringify(parseYAML(source))
+      return stringify(parseYAML(source))
     case 'json5':
-      return JSON.stringify(parseJSON5(source))
+      return stringify(parseJSON5(source))
     default: // fallback to 'json'
-      return JSON.stringify(JSON.parse(source))
+      return stringify(JSON.parse(source))
   }
 }
 

test/__snapshots__/process.test.ts.snap

@@ -12,7 +12,14 @@ exports[`process (json.vue) returns expected string: json.vue 1`] = `
 ]"
 `;
 
-exports[`process (json-locale-import.vue) returns expected string: json-locale-import.vue 1`] = `
+exports[`process (json-locale.vue) returns expected string: json-locale.vue 1`] = `
+"__vue__options__.__i18n = [
+'{\\"ja\\":{\\"hello\\":\\"こんにちは！\\"}}',
+'{\\"en\\":{\\"hello\\":\\"hello!\\"}}'
+]"
+`;
+
+exports[`process (json-src-import.vue) returns expected string: json-src-import.vue 1`] = `
 "__vue__options__.__i18n = [
 '{\\"ja\\":{\\"hello\\":\\"こんにちは！\\"},\\"en\\":{\\"hello\\":\\"hello!\\"}}'
 ]"
@@ -24,19 +31,35 @@ exports[`process (json5.vue) returns expected string: json5.vue 1`] = `
 ]"
 `;
 
-exports[`process (json5-locale-import.vue) returns expected string: json5-locale-import.vue 1`] = `
+exports[`process (json5-locale.vue) returns expected string: json5-locale.vue 1`] = `
+"__vue__options__.__i18n = [
+'{\\"ja\\":{\\"hello\\":\\"こんにちは！\\"}}',
+'{\\"en\\":{\\"hello\\":\\"hello!\\"}}'
+]"
+`;
+
+exports[`process (json5-src-import.vue) returns expected string: json5-src-import.vue 1`] = `
 "__vue__options__.__i18n = [
 '{\\"ja\\":{\\"hello\\":\\"こんにちは！\\"},\\"en\\":{\\"hello\\":\\"hello!\\"}}'
 ]"
 `;
 
+exports[`process (no-i18n.vue) returns expected string: no-i18n.vue 1`] = `""`;
+
 exports[`process (yaml.vue) returns expected string: yaml.vue 1`] = `
 "__vue__options__.__i18n = [
 '{\\"ja\\":{\\"hello\\":\\"こんにちは！\\"},\\"en\\":{\\"hello\\":\\"hello!\\"}}'
 ]"
 `;
 
-exports[`process (yaml-locale-import.vue) returns expected string: yaml-locale-import.vue 1`] = `
+exports[`process (yaml-locale.vue) returns expected string: yaml-locale.vue 1`] = `
+"__vue__options__.__i18n = [
+'{\\"ja\\":{\\"hello\\":\\"こんにちは！\\"}}',
+'{\\"en\\":{\\"hello\\":\\"hello!\\"}}'
+]"
+`;
+
+exports[`process (yaml-src-import.vue) returns expected string: yaml-src-import.vue 1`] = `
 "__vue__options__.__i18n = [
 '{\\"ja\\":{\\"hello\\":\\"こんにちは！\\"},\\"en\\":{\\"hello\\":\\"hello!\\"}}'
 ]"

test/fixtures/default.vue

@@ -16,4 +16,8 @@ export default {
     "hello": "hello!"
   }
 }
-</i18n>
+</i18n>
+
+<other>
+should be ignored
+</other>

test/fixtures/json-locale.vue

@@ -0,0 +1,20 @@
+<template>
+  <p>hello!</p>
+</template>
+
+<script>
+export default {
+}
+</script>
+
+<i18n lang="json" locale="ja">
+{
+  "hello": "こんにちは！"
+}
+</i18n>
+
+<i18n lang="json" locale="en">
+{
+  "hello": "hello!"
+}
+</i18n>

test/fixtures/json5-locale.vue

@@ -0,0 +1,20 @@
+<template>
+  <p>hello!</p>
+</template>
+
+<script>
+export default {
+}
+</script>
+
+<i18n lang="json5" locale="ja">
+{
+  hello: "こんにちは！"
+}
+</i18n>
+
+<i18n lang="json5" locale="en">
+{
+  "hello": "hello!"
+}
+</i18n>

test/fixtures/no-i18n.vue

@@ -0,0 +1,8 @@
+<template>
+  <p>hello!</p>
+</template>
+
+<script>
+export default {
+}
+</script>

test/fixtures/yaml-locale.vue

@@ -0,0 +1,17 @@
+<template>
+  <p>hello!</p>
+</template>
+
+<script>
+export default {
+}
+</script>
+
+<i18n lang="yaml" locale="ja">
+hello: こんにちは！
+</i18n>
+
+<i18n lang="yaml" locale="en">
+hello: hello!
+</i18n>
+

test/process.test.ts

@@ -5,13 +5,17 @@ import { parseComponent } from 'vue-template-compiler'
 import process from '../src/process'
 
 const files = [
+  'no-i18n.vue',
   'default.vue',
   'json.vue',
-  'json-locale-import.vue',
+  'json-src-import.vue',
+  'json-locale.vue',
   'yaml.vue',
-  'yaml-locale-import.vue',
+  'yaml-src-import.vue',
+  'yaml-locale.vue',
   'json5.vue',
-  'json5-locale-import.vue'
+  'json5-src-import.vue',
+  'json5-locale.vue'
 ]
 
 describe('process', () => {