Comments (23)
Or better is possible to include it directly in the library itself.
Like vue-axios does.
from vue-wait.
from vue-wait.
@algil I changed VueConstructor
to Vue
in the vue-wait.d.ts
sample code, and this seemed to work for me:
declare module 'vue/types/vue' {
interface Vue {
$wait: VueWait;
}
}
This is how vuex does it.
from vue-wait.
I'm having issues with
import { waitFor } from 'vue-wait';
Any info on this?
Module '"node_modules/vue-wait"' has no exported member 'waitFor'. Did you mean to use 'import waitFor from "node_modules/vue-wait/src/types"' instead? ts(2614)
from vue-wait.
Hi @fraparisi!
I've used the your .d.ts file, but Vue components (typescript class style) don't recognise this.$wait
How do you use $wait
and others methods as waitFor
?
Thanks!
from vue-wait.
Hi @algil, for fix some error in ts compiler you can try using my solution for typings as here #64.
For $wait, u can place the file attached into your src and then in your main.ts use like this
new Vue({ wait : new VueWait({ useVuex: true, }), render: (h) => h(App), }).$mount('#app');
from vue-wait.
@fraparisi are you using a project generated with Vue Cli 3?
from vue-wait.
Any update here? I would like to use the lib in my typescript classes to fix the missing async getter issue that typescript has.
Therefore I import waitFor like so
import { waitFor } from 'vue-wait';
Currently this import statement produces a typescript syntax error.
from vue-wait.
from vue-wait.
@DavidLambauer For a workaround, you can install 1.3.2 version, and copy .d.ts file to your project. (I’ve put it on @/types/declare
)
p.s. you need restart dev server to load your own declare file.
from vue-wait.
Hi, yes, vue project generated by vue cli 3.
Ok, @fraparisi, but then I have 2 d.ts files:
// shims-vue.d.ts
declare module '*.vue' {
import Vue from 'vue';
export default Vue;
}
// vue-wait.d.ts
import Vue from 'vue';
import VueWait from 'vue-wait';
declare module 'vue/types/vue' {
interface VueConstructor {
$wait: VueWait;
}
}
declare module 'vue/types/options' {
interface ComponentOptions<V extends Vue> {
wait?: VueWait;
}
}
With these files wait
can be used in new Vue
as a property:
// main.ts
new Vue({
router,
store,
i18n,
wait,
render: h => h(App),
}).$mount('#app');
But not in a vue component:
created() {
this.$wait.start('something'); // this shows an error in the editor
}
from vue-wait.
@yoyoys adding an additional definitions file is not what I want 🙄. I suppressed the warning for the moment. Hopefully, this can be fixed soon? Unfortunately, I don't feel that I could fix it on my own.
from vue-wait.
I am not very into the TypeScript definition files, can someone add a section to the README or update the index.d.ts
file? I can immediately release a new version.
from vue-wait.
Hi, yes, vue project generated by vue cli 3.
Ok, @fraparisi, but then I have 2 d.ts files:
// shims-vue.d.ts declare module '*.vue' { import Vue from 'vue'; export default Vue; }// vue-wait.d.ts import Vue from 'vue'; import VueWait from 'vue-wait'; declare module 'vue/types/vue' { interface VueConstructor { $wait: VueWait; } } declare module 'vue/types/options' { interface ComponentOptions<V extends Vue> { wait?: VueWait; } }With these files
wait
can be used innew Vue
as a property:// main.ts new Vue({ router, store, i18n, wait, render: h => h(App), }).$mount('#app');But not in a vue component:
created() { this.$wait.start('something'); // this shows an error in the editor }
I've no problem using this.$wait, PhpStorm does not emit any error. Can u show me your tsconfig.json?
from vue-wait.
file? I can immediat
I've already fix Type Description e fix the conflict in my Merge request, u can use that file.
from vue-wait.
@fraparisi These are my tsconfig files (I'm using a monorepo)
In the roor folder:
{
"compilerOptions": {
"target": "esnext",
"module": "esnext",
"strict": true,
"importHelpers": true,
"moduleResolution": "node",
"experimentalDecorators": true,
"esModuleInterop": true,
"emitDecoratorMetadata": true,
"allowSyntheticDefaultImports": true,
"noImplicitAny": false,
"sourceMap": true,
"types": [
"node",
"jest",
"webpack",
"webpack-env"
],
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
},
"exclude": [
"node_modules"
]
}
In my Vue app:
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"jsx": "preserve",
"strictNullChecks": false,
"baseUrl": ".",
"paths": {
"@/*": [
"./src/*"
]
}
},
"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx"
],
"exclude": [
"node_modules"
]
}
from vue-wait.
@algil This is mine:
{
"compilerOptions": {
"target": "esnext",
"module": "esnext",
"strict": true,
"jsx": "preserve",
"importHelpers": true,
"moduleResolution": "node",
"incremental": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"sourceMap": true,
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"noImplicitAny": true,
"baseUrl": ".",
"types": [
"vuetify",
"webpack",
"webpack-env"
],
"paths": {
"@/*": [
"src/*"
]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
},
"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx",
"src/**/*.html"
],
"exclude": [
"node_modules"
]
and is all included in one point and I don't have the same error u have.
I use vue-wait like this:
import VueWait from 'vue-wait';
...
Vue.use(VueWait);
...
new Vue({
router,
store,
i18n,
wait : new VueWait({
useVuex: true,
}),
render: (h) => h(App),
}).$mount('#app');
from vue-wait.
from vue-wait.
@ArthurN That's great!
Thanks!
from vue-wait.
I'm having same issue.
Probably because the waitFor type definition does not exist.
from vue-wait.
@f, will vue-wait add TypeScript support soon?
Here's my tsconfig.json
types:
"types": [
"@types/node",
"@nuxt/types",
"@nuxtjs/axios",
"@nuxtjs/auth-next",
"@nuxtjs/moment",
"vue-wait"
]
from vue-wait.
i use this
// shims-vue.d.ts
import VueWait from 'vue-wait';
declare module 'vue/types/options' {
export interface ComponentOptions<V extends Vue> {
wait?: VueWait;
}
}
declare module 'vue/types/vue' {
export interface Vue {
$wait: VueWait;
}
}
from vue-wait.
Can you open this as a PR?
from vue-wait.
Related Issues (20)
- Vue.js 3 support HOT 3
- Vue 3 Complaining createVueWait() is not a function HOT 3
- NPM v7 could not resolve peer dependency for vue 3 HOT 2
- Twice as big when introducing Vue 3
- Vuex not initialized HOT 2
- Usage in nuxtjs3 (plugin attempt) HOT 1
- Using with vite // TypeError: VueWait is not a constructor HOT 3
- Vue3 Composition API?
- Installing latest version still requires Vue 2 HOT 2
- vue-wait integration for pinia
- sponsor HOT 1
- mapWaitingActions
- Compiled version is not compatible with ie10
- Add integration with nuxt asyncData/fetch
- Use vue-wait with vue-router and beforeRouteEnter HOT 1
- get is invoked when the v-wait is not complete.
- Failing on Server Side Rendering in Nuxt HOT 3
- vuex-module-decorators Integration
- Demo link does not work HOT 1
- [Bug Report] `[vuex] unknown action type: wait/start` occurred on Vue TypeScript HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from vue-wait.