vue-html-to-paper icon indicating copy to clipboard operation
vue-html-to-paper copied to clipboard

Use vue-html-to-paper with typescript

Open yzx9 opened this issue 6 years ago • 5 comments

The plugin cannot work in typescript. We need to add a type declaration here, like this:

// types/index.d.ts

import { PluginFunction } from "vue"

// See https://www.w3schools.com/Jsref/met_win_open.asp
export interface Options {
  name?: "_blank" | "_parent" | "_self" | "_top" | string
  specs?: string[]
  styles?: string[]
  replace?: boolean
}

/**
 * Install all vue-html-to-paper components into Vue.
 * Please do not invoke this method directly.
 * Call `Vue.use(VueHtmlToPaper)` to install.
 */
export const install: PluginFunction<Options>

module "vue/types/vue" {
  interface Vue {
    $htmlToPaper: (id: string, callback: () => void) => void
  }
}

yzx9 avatar Jun 12 '19 03:06 yzx9

Temporary solutions:

// src/vue-html-to-paper.d.ts

declare module "vue-html-to-paper" {
  import { PluginFunction } from "vue"

  // See https://www.w3schools.com/Jsref/met_win_open.asp
  interface Options {
    name?: "_blank" | "_parent" | "_self" | "_top" | string
    specs?: string[]
    styles?: string[]
    replace?: boolean
  }
  export const install: PluginFunction<Options>

  module "vue/types/vue" {
    interface Vue {
      $htmlToPaper: (id: string, callback: () => void) => void
    }
  }
}

yzx9 avatar Jun 12 '19 03:06 yzx9

A small mistake: $htmlToPaper: (id: string, callback?: () => void) => void

yzx9 avatar Jun 12 '19 03:06 yzx9

Hi @nsznsznjsz please keep the temporary solution on your side for now. I will update the typings soon. Thanks.

jofftiquez avatar Jun 12 '19 07:06 jofftiquez

@nsznsznjsz thank you it works like a charm

irhamputra avatar Oct 21 '20 13:10 irhamputra

These typings seem to work for version 1.4.3:

declare module 'vue-html-to-paper' {
  import { PluginFunction } from 'vue';

  // See https://www.w3schools.com/Jsref/met_win_open.asp
  interface Options {
    name?: '_blank' | '_parent' | '_self' | '_top' | string;
    specs?: string[];
    styles?: string[];
    timeout?: number;
    autoClose?: boolean;
    windowTitle?: string;
  }
  export const install: PluginFunction<Options>;

  module 'vue/types/vue' {
    interface Vue {
      $htmlToPaper: (id: string, options?: Options, callback?: () => void) => void;
    }
  }
}

adamalfredsson avatar Aug 23 '21 12:08 adamalfredsson