vueComponent / ant-design-vue

🌈 An enterprise-class UI components based on Ant Design and Vue. 🐜
https://antdv.com/
Other
20.1k stars 3.78k forks source link

using <a-button> or <a-input> in .vue file, had an error:Cannot read property 'getPrefixCls' of undefined #3314

Closed WayneWang98 closed 3 years ago

WayneWang98 commented 3 years ago

Version

2.0.0-rc.2

Environment

vue3.0, antd-vue 2.0.0-rc.2 and TypeScript

Reproduction link

http://localhost:8080/

Steps to reproduce

1.create a project with vue-cli 4.5 2.install antd-vue@next 3.edit the main.ts, import antd-vue and it`s stylesheet in main.ts. 4.createApp(App).use(store).use(router).use(Antd).mount('#app') 5.use or in HelloWorld.vue

What is expected?

I expected it will show a button in my page with using global antd-vue componets.

What is actually happening?

The console throw an error and some warning when I using the or other components. The error message: Uncaught TypeError: Cannot read property 'getPrefixCls' of undefined at Proxy.render (Input.js?e36d:203) at renderComponentRoot (runtime-core.esm-bundler.js?5c40:696) at componentEffect (runtime-core.esm-bundler.js?5c40:4035) at reactiveEffect (reactivity.esm-bundler.js?a1e9:42) at effect (reactivity.esm-bundler.js?a1e9:17) at setupRenderEffect (runtime-core.esm-bundler.js?5c40:4018) at mountComponent (runtime-core.esm-bundler.js?5c40:3976) at processComponent (runtime-core.esm-bundler.js?5c40:3936) at patch (runtime-core.esm-bundler.js?5c40:3547) at mountChildren (runtime-core.esm-bundler.js?5c40:3736)


My package.json: { "name": "app", "version": "0.1.0", "private": true, "scripts": { "serve": "vue-cli-service serve", "build": "vue-cli-service build", "test:unit": "vue-cli-service test:unit", "lint": "vue-cli-service lint" }, "dependencies": { "ant-design-vue": "^2.0.0-rc.2", "axios": "^0.21.0", "core-js": "^3.6.5", "vue": "^3.0.0", "vue-class-component": "^8.0.0-0", "vue-router": "^4.0.0-0", "vuex": "^4.0.0-0" }, "devDependencies": { "@types/jest": "^24.0.19", "@typescript-eslint/eslint-plugin": "^2.33.0", "@typescript-eslint/parser": "^2.33.0", "@vue/cli-plugin-babel": "~4.5.0", "@vue/cli-plugin-eslint": "~4.5.0", "@vue/cli-plugin-router": "~4.5.0", "@vue/cli-plugin-typescript": "~4.5.0", "@vue/cli-plugin-unit-jest": "~4.5.0", "@vue/cli-plugin-vuex": "~4.5.0", "@vue/cli-service": "~4.5.0", "@vue/compiler-sfc": "^3.0.0", "@vue/eslint-config-typescript": "^5.0.2", "@vue/test-utils": "^2.0.0-0", "eslint": "^6.7.2", "eslint-plugin-vue": "^7.0.0-0", "stylus": "^0.54.7", "stylus-loader": "^3.0.2", "typescript": "~3.9.3", "vue-jest": "^5.0.0-0" } }

main.ts: import { createApp } from 'vue' import App from './App.vue' import router from './router' import store from './store' import Antd from 'ant-design-vue' import 'ant-design-vue/dist/antd.css'

createApp(App).use(store).use(router).use(Antd).mount('#app')

The error message: Cannot read property 'getPrefixCls' of undefined.

github-actions[bot] commented 3 years ago

Hello @WayneWang98. Please provide a online reproduction by forking this link for vue2link for vue3 or a minimal GitHub repository.Make sure to choose the correct version.

你好 @WayneWang98, 我们需要你提供一个在线的重现实例以便于我们帮你排查问题。你可以通过点击 此处 for vue2此处 for vue3 创建一个 codesandbox 或者提供一个最小化的 GitHub 仓库。请确保选择准确的版本。

WayneWang98 commented 3 years ago

Thanks for your answer. I had solved the problem. It may caused by the cnpm tools. When I delete the node_modules folder and use npm to install the package, it worked well.

github-actions[bot] commented 2 years ago

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.