Comments (15)
This tsconfig.json
fixed my issues:
{
"compilerOptions": {
"baseUrl": ".",
"target": "ESNext",
"useDefineForClassFields": true,
"module": "ESNext",
"moduleResolution": "Node",
"strict": true,
"jsx": "preserve",
"resolveJsonModule": true,
"isolatedModules": true,
"esModuleInterop": true,
"lib": ["ESNext", "DOM"],
"skipLibCheck": true,
"noEmit": true,
"paths": {
"@/*": ["src/*"]
},
"types": ["vite-plugin-vue-layouts/client", "node"]
},
"include": [
"src/**/*.ts",
"src/**/*.d.ts",
"src/**/*.tsx",
"src/**/*.vue",
"typed-router.d.ts"
],
"references": [{ "path": "./tsconfig.node.json" }],
"exclude": ["node_modules"]
}
Note that changes were made to types
and include
.
from create.
I have found the fix: https://github.com/posva/unplugin-vue-router?tab=readme-ov-file#typescript
I guess typed-router.d.ts
should be added to the tsconfig.json
by the create-vuetify if you select typescript true
from create.
I tested locally and what's missing is "moduleResolution": "Bundler",
in the tsconfig.json (it's a recommended setting). I will add that to the docs
from create.
Hmm, bummer to hear that.
I did nothing special, just add it to the include field as stated in the docs.
.
from create.
I can confirm that adding the following in tsconfig.json
fixes the issue for me:
- Under
compilerOptions
, add:
"types": [
"unplugin-vue-router/client",
"vite-plugin-vue-layouts/client"
]
- Under
include
, add:
"./typed-router.d.ts"
from create.
This
tsconfig.json
fixed my issues:{ "compilerOptions": { "baseUrl": ".", "target": "ESNext", "useDefineForClassFields": true, "module": "ESNext", "moduleResolution": "Node", "strict": true, "jsx": "preserve", "resolveJsonModule": true, "isolatedModules": true, "esModuleInterop": true, "lib": ["ESNext", "DOM"], "skipLibCheck": true, "noEmit": true, "paths": { "@/*": ["src/*"] }, "types": ["vite-plugin-vue-layouts/client", "node"] }, "include": [ "src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue", "typed-router.d.ts" ], "references": [{ "path": "./tsconfig.node.json" }], "exclude": ["node_modules"] }Note that changes were made to
types
andinclude
.
This did solve the issue.
from create.
Possibly related to #41
I also just tested with the Default preset, yarn build
works fine. Something's off with the auto router stuff.
from create.
I have found the fix: https://github.com/posva/unplugin-vue-router?tab=readme-ov-file#typescript
I guess
typed-router.d.ts
should be added to thetsconfig.json
by the create-vuetify if you select typescript true
I tried that fix and no luck. Maybe I am doing it wrong. Can you share your tsconfig.json
file?
from create.
does it fix error TS2307: Cannot find module 'virtual:generated-layouts' or its corresponding type declarations. for you ? i fixed the first issue with typed-router but not this one.
and when you create a vuetify projet with the other preset the version shown is the last one, whereas essentials preset show 3.0.0
from create.
The virtual:generated-layouts issue is a missing option that needs to be added for to tsconfig for vite-plugin-vue-layouts.
https://github.com/JohnCampionJr/vite-plugin-vue-layouts
{
"compilerOptions": {
"types": ["vite-plugin-vue-layouts/client"]
}
}
Following the above, 'vue-router/auto' missing error happens when upgrading unplugin-vue-router to 0.8.x, which for some reason does not generate the vue-router/auto module in the d.ts file
from create.
@posva still have this problem with this config in tsconfig.json
{
"include": [
"./typed-router.d.ts"
],
"compilerOptions": {
"module": "ES2015",
"moduleResolution": "Bundler",
"types": [
"unplugin-vue-router/client",
]
},
"files": [],
"references": [
{
"path": "./tsconfig.node.json"
},
{
"path": "./tsconfig.app.json"
}
],
}
any other config should I use ?
from create.
@posva still have this problem with this config in tsconfig.json
{ "include": [ "./typed-router.d.ts" ], "compilerOptions": { "module": "ES2015", "moduleResolution": "Bundler", "types": [ "unplugin-vue-router/client", ] }, "files": [], "references": [ { "path": "./tsconfig.node.json" }, { "path": "./tsconfig.app.json" } ], }
any other config should I use ?
but when I use this config and run "run-p type-check \"build-only {@}\" --"
,no error happened
from create.
This should probably be reopened as the current default is:
"include": [
"./src/typed-router.d.ts"
],
And changing to
"include": [
"src/**/*.ts",
"src/**/*.d.ts",
"src/**/*.tsx",
"src/**/*.vue",
"src/typed-router.d.ts"
],
Fixes all issues with these imports
import { createRouter, createWebHistory } from 'vue-router/auto'
import { setupLayouts } from 'virtual:generated-layouts'
Module '"vue-router/auto"' has no exported member 'createWebHistory'.ts(2305)
Module '"vue-router/auto"' has no exported member 'createRouter'.ts(2305)
Cannot find module 'virtual:generated-layouts' or its corresponding type declarations.ts(2307)
from create.
What install options are you using?
from create.
This should probably be reopened as the current default is:
"include": [ "./src/typed-router.d.ts" ],And changing to
"include": [ "src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue", "src/typed-router.d.ts" ],Fixes all issues with these imports
import { createRouter, createWebHistory } from 'vue-router/auto' import { setupLayouts } from 'virtual:generated-layouts'Module '"vue-router/auto"' has no exported member 'createWebHistory'.ts(2305) Module '"vue-router/auto"' has no exported member 'createRouter'.ts(2305) Cannot find module 'virtual:generated-layouts' or its corresponding type declarations.ts(2307)
I am also having the same issue in regardles to not being able to find the modules. I have been through the documents at least 10x checking things.
In regards to above. I created a new test project and ran through the documentation with no issue.
This leaves me more confused because when checking both of the projects the layout is the same with the exception of a few other settings. No customization's have been made to the options within the vite.config.ts.
I am rather confused at this point.
I did notice on the test project that, within the router/index.ts, the the vue-router/auto resolves to the client.d.ts file within the unplugin-vue-router/client.d.ts/vue-router/auto which is to be expected. I understand that much.
Im just really confused why my existing project ,when moving over to router/auto cannot find the same modules. I DID manually go and verify the files were there (within the node_modules). There seems to be a link somewhere that is broken.
Im going to ask a college to review this with me to make sure no spelling errors (though i used C&P techniques).
Update: Co-worker and I did figure out that the plugin is working but there is still a reference issue with the modules ion the router/index.ts file. Not sure how to fix them at this time
from create.
Related Issues (20)
- [Bug Report][3.3.23] npm default preset scaffolding HOT 3
- [Bug Report][create-vuetify 2.0.0] yarn dev error and yarn build error HOT 7
- Package.json dependencies showing wrong version
- [Feature Request] Suggestion: Change wording in create-vuetify HOT 4
- SyntaxError: missing ) after argument list
- [Feature Request] "npm create vuetify" need update HOT 8
- Roboto italic is missing from generated unplugin-fonts config
- pnpm create vuetify -- Base, devServer fails to start HOT 1
- [Bug Report][3.5.2] Get started with Vuetify 3 throws errors on npm run build HOT 1
- [Bug Report][3.5.2] "npm create vuetify" does not produce working project HOT 4
- [Bug Report][3.5.2] Get started with Vuetify 3 throws errors on npm run build HOT 3
- Allow developer to choose between the classic vue-router implementation and the one with unplugin-vue-router
- [Bug Report][3.5.12] Layout issue when using Essential preset of create-vuetify
- [Bug Report][3.5.13] Issue with a `unplugin-vue-router` "Catch all / 404 Not found" file which includes a `v-btn` (e.g. [...all.vue]) HOT 2
- 'npm run lint' command doesn't work
- yarn: create template missing dependency
- tsconfig is not generated correctly HOT 3
- Failed to parse source for import analysis because the content contains invalid JS syntax HOT 1
- Add Roboto font as dependency instead of using Google-hosted fonts HOT 1
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 create.