fix(types): improve typescript type definitions

fluent-vue · Feb 18, 2020 · a07a8e3 · a07a8e3
1 parent 1ea5b26
commit a07a8e3
Show file tree

Hide file tree

Showing 18 changed files with 5,505 additions and 92 deletions.
diff --git a/examples/hello-world/package.json b/examples/hello-world/package.json
@@ -9,7 +9,7 @@
   "dependencies": {
     "@fluent/bundle": "^0.15.0",
     "@fluent/dedent": "^0.1.0",
-    "fluent-vue": "2.4.1",
+    "fluent-vue": "link:../..",
     "vue-hot-reload-api": "^2.3.3"
   },
   "devDependencies": {

diff --git a/examples/hello-world/yarn.lock b/examples/hello-world/yarn.lock
@@ -2267,14 +2267,9 @@ find-up@^3.0.0:
   dependencies:
     locate-path "^3.0.0"
 
-[email protected]:
-  version "2.4.1"
-  resolved "https://registry.yarnpkg.com/fluent-vue/-/fluent-vue-2.4.1.tgz#f27401658f7cacefc3ae8cab54d292889ab132c8"
-  integrity sha512-XUZPZxR2peMAilN00+MjwUYpNNxNvQmghvxBXNqZuby/BYHd+IPJA/mudt+mpHW/R455LKheDi2QSoXK2wTnnQ==
-  dependencies:
-    "@fluent/sequence" "^0.4.0"
-    cached-iterable "^0.3.0"
-    tslib "^1.10.0"
+"fluent-vue@link:../..":
+  version "0.0.0"
+  uid ""
 
 for-in@^1.0.2:
   version "1.0.2"

diff --git a/examples/typescript/package.json b/examples/typescript/package.json
@@ -0,0 +1,19 @@
+{
+  "name": "hello-world",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "start": "parcel serve public/index.html",
+    "build": "parcel build public/index.html"
+  },
+  "dependencies": {
+    "@fluent/bundle": "^0.15.0",
+    "@fluent/dedent": "^0.1.0",
+    "fluent-vue": "link:../..",
+    "vue-hot-reload-api": "^2.3.3"
+  },
+  "devDependencies": {
+    "@vue/component-compiler-utils": "^3.0.0",
+    "parcel-bundler": "^1.12.3"
+  }
+}
diff --git a/examples/typescript/public/index.html b/examples/typescript/public/index.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Hello world - a fluent-vue example</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script src="../src/index.ts"></script>
+  </body>
+</html>
diff --git a/examples/typescript/src/App.vue b/examples/typescript/src/App.vue
@@ -0,0 +1,47 @@
+<template>
+  <div>
+    <h3>Examples</h3>
+
+    <h4>$t method</h4>
+    <div>
+      <span>
+        {{ $t('greeting', { name: 'World' }) }}
+      </span>
+    </div>
+
+    <h4>$ta method</h4>
+    <div>
+     <span v-bind="$ta('greeting')">{{ $t('greeting', { name: 'World' }) }}</span>
+    </div>
+
+    <h4>Directive</h4>
+    <div>
+      <span v-t:greeting="{ name: 'World' }"></span>
+    </div>
+
+    <h4>Component</h4>
+    <div>
+      <i18n path="greeting" tag="div">
+        <template #name>
+          <b>{{ $t('user-name') }}</b>
+        </template>
+      </i18n>
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+  import Vue from 'vue'
+
+  export default Vue.extend({
+    name: 'typescript',
+    computed: {
+      t () {
+        return this.$t('user-name')
+      },
+      ta () {
+        return this.$ta('greeting')
+      }
+    }
+  })
+</script>
diff --git a/examples/typescript/src/index.ts b/examples/typescript/src/index.ts
@@ -0,0 +1,28 @@
+import Vue from 'vue';
+import { FluentBundle, FluentResource } from '@fluent/bundle';
+import ftl from '@fluent/dedent';
+import FluentVue from 'fluent-vue';
+
+import App from './App.vue';
+
+Vue.use(FluentVue)
+
+const bundle = new FluentBundle('en')
+
+bundle.addResource(new FluentResource('user-name = World'))
+bundle.addResource(new FluentResource('aria-key = Aria value'))
+bundle.addResource(new FluentResource(
+  ftl`
+  greeting = Hello, {$name}
+    .aria-label = Label value
+  `))
+
+const fluent = new FluentVue({
+  bundles: [bundle]
+})
+
+new Vue({
+  el: "#root",
+  fluent,
+  render: h => h(App)
+})
diff --git a/examples/typescript/src/vue-shims.ts b/examples/typescript/src/vue-shims.ts
@@ -0,0 +1,3 @@
+declare module '*.vue' {
+  export default Vue
+}
diff --git a/examples/typescript/tsconfig.json b/examples/typescript/tsconfig.json
@@ -0,0 +1,18 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "strict": true,
+    "module": "es2015",
+    "moduleResolution": "node"
+  },
+  "include": [
+    "src/**/*.ts",
+    "src/**/*.vue"
+  ],
+  "files": [
+    "src/vue-shims.d.ts"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}