Modify type files to external module definition format to publish them via npm (#242)

* Rewrite d.ts in external module definition format

* Publish type files via npm

Author: ktsn

logger.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Types for the logger plugin.
+ * This file must be put alongside the JavaScript file of the logger.
+ */
+
+import { MutationObject, Plugin } from './types/index'
+
+export interface LoggerOption<S> {
+  collapsed?: boolean;
+  transformer?: (state: S) => any;
+  mutationTransformer?: (mutation: MutationObject<any>) => any;
+}
+
+export default function createLogger<S>(option: LoggerOption<S>): Plugin<S>;

package.json

@@ -3,10 +3,14 @@
   "version": "1.0.0-rc.2",
   "description": "state management for Vue.js",
   "main": "dist/vuex.js",
+  "typings": "types/index.d.ts",
   "files": [
     "dist",
     "src",
-    "logger.js"
+    "types/index.d.ts",
+    "types/vue.d.ts",
+    "logger.js",
+    "logger.d.ts"
   ],
   "scripts": {
     "counter": "cd examples/counter && webpack-dev-server --inline --hot --config ../webpack.shared.config.js",

types/index.d.ts

@@ -1,93 +1,66 @@
-declare namespace Vuex {
-  class Store<S> {
-    constructor(options: StoreOption<S>);
+import './vue'
 
-    state: S;
+export class Store<S> {
+  constructor(options: StoreOption<S>);
 
-    dispatch(mutationName: string, ...args: any[]): void;
-    dispatch<P>(mutation: MutationObject<P>): void;
+  state: S;
 
-    replaceState(state: S): void;
+  dispatch(mutationName: string, ...args: any[]): void;
+  dispatch<P>(mutation: MutationObject<P>): void;
 
-    watch<T>(getter: Getter<S, T>, cb: (value: T) => void, options?: WatchOption): void;
+  replaceState(state: S): void;
 
-    hotUpdate(options: {
-      mutations?: MutationTree<S>;
-      modules?: ModuleTree;
-    }): void;
+  watch<T>(getter: Getter<S, T>, cb: (value: T) => void, options?: WatchOption): void;
 
-    subscribe(cb: (mutation: MutationObject<any>, state: S) => void): () => void;
-  }
-
-  function install(Vue: vuejs.VueStatic): void;
-
-  interface StoreOption<S> {
-    state?: S;
+  hotUpdate(options: {
     mutations?: MutationTree<S>;
     modules?: ModuleTree;
-    plugins?: Plugin<S>[];
-    strict?: boolean;
-  }
-
-  type Getter<S, T> = (state: S) => T;
-  type Action<S> = (store: Store<S>, ...args: any[]) => any;
-  type Mutation<S> = (state: S, ...args: any[]) => void;
-  type Plugin<S> = (store: Store<S>) => void;
-
-  interface MutationTree<S> {
-    [key: string]: Mutation<S>;
-  }
-
-  interface MutationObject<P> {
-    type: string;
-    silent?: boolean;
-    payload?: P;
-  }
-
-  interface Module<S> {
-    state?: S;
-    mutations?: MutationTree<S>;
-    modules?: ModuleTree;
-  }
+  }): void;
 
-  interface ModuleTree {
-    [key: string]: Module<any>;
-  }
+  subscribe(cb: (mutation: MutationObject<any>, state: S) => void): () => void;
+}
 
-  interface ComponentOption<S> {
-    getters: { [key: string]: Getter<S, any> };
-    actions: { [key: string]: Action<S> };
-  }
+export function install(Vue: vuejs.VueStatic): void;
 
-  interface WatchOption {
-    deep?: boolean;
-    immidiate?: boolean;
-  }
+export interface StoreOption<S> {
+  state?: S;
+  mutations?: MutationTree<S>;
+  modules?: ModuleTree;
+  plugins?: Plugin<S>[];
+  strict?: boolean;
+}
+
+type Getter<S, T> = (state: S) => T;
+type Action<S> = (store: Store<S>, ...args: any[]) => any;
+type Mutation<S> = (state: S, ...args: any[]) => void;
+type Plugin<S> = (store: Store<S>) => void;
 
-  function createLogger<S>(option: LoggerOption<S>): Plugin<S>;
+export interface MutationTree<S> {
+  [key: string]: Mutation<S>;
+}
 
-  interface LoggerOption<S> {
-    collapsed?: boolean;
-    transformer?: (state: S) => any;
-    mutationTransformer?: (mutation: MutationObject<any>) => any;
-  }
+export interface MutationObject<P> {
+  type: string;
+  silent?: boolean;
+  payload?: P;
 }
 
-declare namespace vuejs {
-  interface ComponentOption {
-    vuex?: Vuex.ComponentOption<any>;
-    store?: Vuex.Store<any>;
-  }
+export interface Module<S> {
+  state?: S;
+  mutations?: MutationTree<S>;
+  modules?: ModuleTree;
+}
 
-  interface Vue {
-    $store?: Vuex.Store<any>;
-  }
+export interface ModuleTree {
+  [key: string]: Module<any>;
 }
 
-declare module 'vuex' {
-  export = Vuex
+export interface VuexComponentOption<S> {
+  getters: { [key: string]: Getter<S, any> };
+  actions: { [key: string]: Action<S> };
 }
 
-declare module 'vuex/logger' {
-  export default Vuex.createLogger;
+export interface WatchOption {
+  deep?: boolean;
+  immidiate?: boolean;
 }

types/test/index.ts

@@ -1,6 +1,6 @@
 import * as Vue from 'vue';
-import * as Vuex from 'vuex';
-import createLogger from 'vuex/logger';
+import * as Vuex from '../index';
+import createLogger from '../../logger';
 
 Vue.use(Vuex);
 

types/test/tsconfig.json

@@ -7,6 +7,8 @@
   "files": [
     "index.ts",
     "../index.d.ts",
+    "../../logger.d.ts",
+    "../vue.d.ts",
     "../typings/index.d.ts"
   ]
 }

types/tsconfig.json

@@ -6,6 +6,8 @@
   },
   "files": [
     "index.d.ts",
+    "../logger.d.ts",
+    "vue.d.ts",
     "typings/index.d.ts"
   ]
 }

types/vue.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Extends interfaces in Vue.js
+ */
+
+import { VuexComponentOption, Store } from './index'
+
+declare global {
+  namespace vuejs {
+    interface ComponentOption {
+      vuex?: VuexComponentOption<any>;
+      store?: Store<any>;
+    }
+
+    interface Vue {
+      $store?: Store<any>;
+    }
+  }
+}