Styjun

Placing rectangle box above tikz figure?

Why did Missandei say this?

Align a table column at a specific symbol

I'm attempting to understand my 401k match and how much I need to contribute to maximize the match

What's an appropriate age to involve kids in life changing decisions?

How could a civilization detect tachyons?

Capturing the entire webpage with WebExecute's CaptureImage

How is it believable that Euron could so easily pull off this ambush?

The unknown and unexplained in science fiction

My perfect evil overlord plan... or is it?

Identity of a supposed anonymous referee revealed through "Description" of the report

Using mean length and mean weight to calculate mean BMI?

Examples where existence is harder than evaluation

Was Mohammed the most popular first name for boys born in Berlin in 2018?

What's the difference between "ricochet" and "bounce"?

Bank loan to use as proof of funds for uk visa application

Why is the episode called "The Last of the Starks"?

What is the Ancient One's mistake?

Can the Telekinesis spell be used on yourself for the following?

My parents are Afghan

Can a character shove an enemy who is already prone?

Should one save up to purchase a house/condo or maximize their 401k first?

How would an instant or sorcery with an effect that targets work with Feather?

Is there an idiom that means "revealing a secret unintentionally"?

how to add types for vue plugin?

Are strongly-typed functions as parameters possible in TypeScript?Typescript: Interfaces vs TypesVue 2 - Mutating props vue-warnHow to export “.vue” file as pluginHow to deploy Vue app?Framework7 and Vue typescript typings conflictVue augmented types - XYZ does not exist on typeTypescript types in .vue filesHow to publish a Vue plugin into NPM?Where i may put authorization logic in vue.js?

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty height:90px;width:728px;box-sizing:border-box;

1

1

I try add self plugin for vue with type script.

But at moment when i use my method from vue prototype, my method $auth does not exist on type myComponent. I also add .d.ts for plugin, but i think he is little not correct, and also i think in plugin don't need use install, or need? Just in some examples i dont see install, but in docs say - need use install.

my plugin

import _Vue from 'vue';
import store from '@/store'
import * as firebase from 'firebase';

export default 
 install: (Vue: typeof _Vue, options?: any) => 
 const base = firebase.initializeApp(config);
 const auth = firebase.auth();
 Vue.prototype.$auth = 
 login: async (username: string, pass: string) => 
 return await auth.signInWithEmailAndPassword(username, pass)
 ,
 logout: async () => 
 await auth.signOut()
 
 ;
 auth.onAuthStateChanged((user: any) => 
 store.commit('updateUser', user )
 )
 

myPlugin.d.ts

declare module 'vue/types/vue' 
 interface Vue 
 $auth: 
 login: (username: string, pass: string) => Promise<any>
 ;
 

component

export default class SignUp extends Vue 
 email: string = '';
 password: string = '';

 async onSubmit()
 if ((this.$refs.form as any).validate()) 
 const auth = await this.$auth.login(this.email, this.password)
 
 

typescript vue.js vuejs2

share|improve this question

edited Mar 23 at 7:48

Drop

asked Mar 23 at 7:26

DropDrop

26518

add a comment | 

1

1

I try add self plugin for vue with type script.

But at moment when i use my method from vue prototype, my method $auth does not exist on type myComponent. I also add .d.ts for plugin, but i think he is little not correct, and also i think in plugin don't need use install, or need? Just in some examples i dont see install, but in docs say - need use install.

my plugin

import _Vue from 'vue';
import store from '@/store'
import * as firebase from 'firebase';

export default 
 install: (Vue: typeof _Vue, options?: any) => 
 const base = firebase.initializeApp(config);
 const auth = firebase.auth();
 Vue.prototype.$auth = 
 login: async (username: string, pass: string) => 
 return await auth.signInWithEmailAndPassword(username, pass)
 ,
 logout: async () => 
 await auth.signOut()
 
 ;
 auth.onAuthStateChanged((user: any) => 
 store.commit('updateUser', user )
 )
 

myPlugin.d.ts

declare module 'vue/types/vue' 
 interface Vue 
 $auth: 
 login: (username: string, pass: string) => Promise<any>
 ;
 

component

export default class SignUp extends Vue 
 email: string = '';
 password: string = '';

 async onSubmit()
 if ((this.$refs.form as any).validate()) 
 const auth = await this.$auth.login(this.email, this.password)
 
 

typescript vue.js vuejs2

share|improve this question

edited Mar 23 at 7:48

Drop

asked Mar 23 at 7:26

DropDrop

26518

add a comment | 

I try add self plugin for vue with type script.

But at moment when i use my method from vue prototype, my method $auth does not exist on type myComponent. I also add .d.ts for plugin, but i think he is little not correct, and also i think in plugin don't need use install, or need? Just in some examples i dont see install, but in docs say - need use install.

my plugin

import _Vue from 'vue';
import store from '@/store'
import * as firebase from 'firebase';

export default 
 install: (Vue: typeof _Vue, options?: any) => 
 const base = firebase.initializeApp(config);
 const auth = firebase.auth();
 Vue.prototype.$auth = 
 login: async (username: string, pass: string) => 
 return await auth.signInWithEmailAndPassword(username, pass)
 ,
 logout: async () => 
 await auth.signOut()
 
 ;
 auth.onAuthStateChanged((user: any) => 
 store.commit('updateUser', user )
 )
 

myPlugin.d.ts

declare module 'vue/types/vue' 
 interface Vue 
 $auth: 
 login: (username: string, pass: string) => Promise<any>
 ;
 

component

export default class SignUp extends Vue 
 email: string = '';
 password: string = '';

 async onSubmit()
 if ((this.$refs.form as any).validate()) 
 const auth = await this.$auth.login(this.email, this.password)
 
 

typescript vue.js vuejs2

share|improve this question

edited Mar 23 at 7:48

Drop

asked Mar 23 at 7:26

DropDrop

26518

import _Vue from 'vue';
import store from '@/store'
import * as firebase from 'firebase';

export default 
 install: (Vue: typeof _Vue, options?: any) => 
 const base = firebase.initializeApp(config);
 const auth = firebase.auth();
 Vue.prototype.$auth = 
 login: async (username: string, pass: string) => 
 return await auth.signInWithEmailAndPassword(username, pass)
 ,
 logout: async () => 
 await auth.signOut()
 
 ;
 auth.onAuthStateChanged((user: any) => 
 store.commit('updateUser', user )
 )
 

declare module 'vue/types/vue' 
 interface Vue 
 $auth: 
 login: (username: string, pass: string) => Promise<any>
 ;
 

export default class SignUp extends Vue 
 email: string = '';
 password: string = '';

 async onSubmit()
 if ((this.$refs.form as any).validate()) 
 const auth = await this.$auth.login(this.email, this.password)
 
 

share|improve this question

edited Mar 23 at 7:48

Drop

asked Mar 23 at 7:26

DropDrop

26518

share|improve this question

edited Mar 23 at 7:48

Drop

asked Mar 23 at 7:26

DropDrop

26518

asked Mar 23 at 7:26

DropDrop

26518

asked Mar 23 at 7:26

DropDrop

26518

1 Answer
1

active

oldest

votes

1

1. install function is a strict requirement, this function is used by Vue internally in Vue.use(YourAwesomePlugin) to load your plugin.




2. I could not make the declaration file work as well as you mentioned, but in docs examples an author put the declaration merging in a file with logic (not in a separate d.ts). So if you put content of your myPlugin.d.ts to a main plugin file - it will load your interface and $auth will exist on this.

TS Docs(see Module Augmentation section): Declaration Merging

---

UPDATE

To make .d.ts file work you just need to import vue in that file.

Vue docs: Augmenting Types for Use with Plugins

share|improve this answer

edited Mar 25 at 18:56

answered Mar 24 at 1:53

Max SinevMax Sinev

2,5371817

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55311595%2fhow-to-add-types-for-vue-plugin%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

1

1. install function is a strict requirement, this function is used by Vue internally in Vue.use(YourAwesomePlugin) to load your plugin.




2. I could not make the declaration file work as well as you mentioned, but in docs examples an author put the declaration merging in a file with logic (not in a separate d.ts). So if you put content of your myPlugin.d.ts to a main plugin file - it will load your interface and $auth will exist on this.

TS Docs(see Module Augmentation section): Declaration Merging

---

UPDATE

To make .d.ts file work you just need to import vue in that file.

Vue docs: Augmenting Types for Use with Plugins

share|improve this answer

edited Mar 25 at 18:56

answered Mar 24 at 1:53

Max SinevMax Sinev

2,5371817

add a comment | 

1

1. install function is a strict requirement, this function is used by Vue internally in Vue.use(YourAwesomePlugin) to load your plugin.




2. I could not make the declaration file work as well as you mentioned, but in docs examples an author put the declaration merging in a file with logic (not in a separate d.ts). So if you put content of your myPlugin.d.ts to a main plugin file - it will load your interface and $auth will exist on this.

TS Docs(see Module Augmentation section): Declaration Merging

---

UPDATE

To make .d.ts file work you just need to import vue in that file.

Vue docs: Augmenting Types for Use with Plugins

share|improve this answer

edited Mar 25 at 18:56

answered Mar 24 at 1:53

Max SinevMax Sinev

2,5371817

add a comment | 

1. install function is a strict requirement, this function is used by Vue internally in Vue.use(YourAwesomePlugin) to load your plugin.




2. I could not make the declaration file work as well as you mentioned, but in docs examples an author put the declaration merging in a file with logic (not in a separate d.ts). So if you put content of your myPlugin.d.ts to a main plugin file - it will load your interface and $auth will exist on this.

TS Docs(see Module Augmentation section): Declaration Merging

---

UPDATE

To make .d.ts file work you just need to import vue in that file.

Vue docs: Augmenting Types for Use with Plugins

share|improve this answer

edited Mar 25 at 18:56

answered Mar 24 at 1:53

Max SinevMax Sinev

2,5371817

share|improve this answer

edited Mar 25 at 18:56

answered Mar 24 at 1:53

Max SinevMax Sinev

2,5371817

answered Mar 24 at 1:53

Max SinevMax Sinev

2,5371817

answered Mar 24 at 1:53

Max SinevMax Sinev

2,5371817