嗨,我正在尝试在 Vue 3 中导入一个组件。 这是我的组件结构:
+src +App.vue +components +Navbar.vue
在我的 App.vue 中我尝试过:
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <template> <div> <Navbar/> </div> </template> <script> import Navbar from './components/Navbar.vue'; </script>这是我的 main.ts :
import { createApp } from 'vue' import router from './router' import mitt from 'mitt'; const emitter = mitt(); import 'bootstrap/dist/css/bootstrap.css' import 'bootstrap-vue-3/dist/bootstrap-vue-3.css' import BootstrapVue3 from 'bootstrap-vue-3' import App from './App.vue' const app = createApp(App) app.use(router) app.use(BootstrapVue3) app.mount('#app') app.config.globalProperties.emitter = emitter;
但我收到此错误:
Already included file name '/home/jip/Projects/snippedit/client/src/components/Navbar.vue' differs from file name '/home/jip/Projects/snippedit/client/src/components/navBar.vue' only in casing. The file is in the program because: Imported via './components/Navbar.vue' from file '/home/jip/Projects/snippedit/client/src/App.vue' Root file specified for compilation Root file specified for compilation
有谁知道这个问题的解决办法吗? 提前致谢。
如果您使用
vuter
扩展,请尝试重新启动/重新加载 vscode这就是
App.vue
的样子: