Volar cannot deduce component type correctly
See original GitHub issueQuestion
// package.json
{
"name": "xxx",
"version": "0.0.0",
"scripts": {
"dev": "vite",
"build": "vue-tsc --noEmit && vite build",
"preview": "vite preview --port 5050",
"test:unit": "vitest --environment jsdom",
"test:e2e": "start-server-and-test preview http://127.0.0.1:5050/ 'cypress open'",
"test:e2e:ci": "start-server-and-test preview http://127.0.0.1:5050/ 'cypress run'",
"typecheck": "vue-tsc --noEmit -p tsconfig.vitest.json --composite false",
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
"preinstall": "npx only-allow pnpm -y",
"prepare": "husky install",
"release": "standard-version"
},
"dependencies": {
"@vueuse/core": "^8.2.5",
"pinia": "^2.0.13",
"vue": "^3.2.31",
"vue-router": "^4.0.14"
},
"devDependencies": {
"@arco-design/web-vue": "^2.23.0",
"@commitlint/cli": "^16.2.3",
"@commitlint/config-conventional": "^16.2.1",
"@rushstack/eslint-patch": "^1.1.0",
"@types/jsdom": "^16.2.14",
"@types/node": "^16.11.26",
"@vitejs/plugin-vue": "^2.3.1",
"@vue/eslint-config-prettier": "^7.0.0",
"@vue/eslint-config-typescript": "^10.0.0",
"@vue/test-utils": "^2.0.0-rc.18",
"@vue/tsconfig": "^0.1.3",
"cypress": "^9.5.3",
"eslint": "^8.5.0",
"eslint-plugin-cypress": "^2.12.1",
"eslint-plugin-vue": "^8.2.0",
"husky": "^7.0.4",
"jsdom": "^19.0.0",
"less": "^4.1.2",
"lint-staged": "^12.3.7",
"prettier": "^2.5.1",
"standard-version": "^9.3.2",
"start-server-and-test": "^1.14.0",
"stylelint": "^14.6.1",
"stylelint-config-prettier": "^9.0.3",
"stylelint-config-rational-order": "^0.1.2",
"stylelint-config-standard": "^25.0.0",
"stylelint-order": "^5.0.0",
"typescript": "~4.6.3",
"unplugin-auto-import": "^0.7.1",
"unplugin-vue-components": "^0.19.2",
"vite": "^2.9.1",
"vitest": "^0.8.1",
"vue-tsc": "^0.33.9"
}
}
// vite.config.ts
import { fileURLToPath, URL } from 'url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ArcoResolver } from 'unplugin-vue-components/resolvers'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
vue(),
AutoImport({
dts: 'src/auto-imports.d.ts',
eslintrc: { enabled: true },
imports: ['vue', 'vue-router', '@vueuse/core']
}),
Components({
dirs: ['src/components'],
dts: 'src/components.d.ts',
resolvers: [ArcoResolver({ importStyle: 'less', resolveIcons: true })]
})
],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
}
})
Solution
Issue Analytics
- State:
- Created a year ago
- Comments:9 (6 by maintainers)
Top Results From Across the Web
Volar Plate Fixation - an overview | ScienceDirect Topics
The authors concluded that volar plating is an effective treatment for unstable distal radius fractures in that it allows early motion and return...
Read more >Ganglion Cyst Removal: What to Expect at Home
For 1 to 2 weeks after surgery on your hand or wrist, avoid activities that involve repeated arm or hand movements. These may...
Read more >Nail bed injuries and deformities of nail - PMC - NCBI
Sharp lacerations can occur when objects land with enough force to penetrate the nail plate. Avulsion injuries can result from crush or grinding...
Read more >Distal Radius Fractures: Strategic Alternatives to Volar Plate ...
If a stable posi- tion cannot be identified, TFCC repair and/or open reduction and internal fixation of the basilar styloid or ulnar head...
Read more >vite can't find variable: require - elecbas.com
Just set up the right kind of Vite project, and youre good to go. ... definition not working with some component import statement...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Using
pnpm
, I fixed it by installing@vue/runtime-core
as a devDependency.I’ve also had this happening recently. #344 is what broke it for me but only when installing with
pnpm
. Without any hoisting settings configured, the@vue/*
packages don’t end up in the root modules folder, and TypeScript gets confused, I think.Adding either
shamefully-hoist=true
orpublic-hoist-pattern[]=@vue*
to the projects.npmrc
worked for me.