我有一个应用程序，可以在其中加载组件<router-view/>！
我在导入组件时遇到问题router.js。它总是给我以下错误：
These relative modules were not found:
* ./components/Poetry.vue in ./src/router/routes.js
* ./components/PoetryDetails/PoetryCard.vue in ./src/router/routes.js
* ./components/PoetryDetails/Search.vue in ./src/router/routes.js
我有这样的文件夹结构：
├── _components
| ├── _PoetryDetails
| | └──PoetryCard.vue
| | └──Search.vue
| └── Poetry.vue
├── _router
| ├── index.js (routes.js is imported in this file)
| └── routes.js
├── App.vue
└── main.js
在中routes.js，我将导入以下组件：
import Poetry from './components/Poetry.vue'
import PoetryCard from './components/PoetryDetails/PoetryCard.vue'
import PoetrySearch from './components/PoetryDetails/Search.vue'
export const routes = [
{ path: '', name: 'poetrysearch', component: Poetry, children: [
{ path: 'poetry', name: 'poetrycard', component: PoetryCard },
{ path: 'poetry/search', name: 'poetrysearch', component: PoetrySearch },
]},
]
但是，我仍然收到该死的错误。请帮忙。
您正在使用相对路径。在您的中routes.js，应该是
import Poetry from '../components/Poetry.vue'
import PoetryCard from '../components/PoetryDetails/PoetryCard.vue'
import PoetrySearch from '../components/PoetryDetails/Search.vue'
.. 表示要转到父文件夹。
如果您使用的是webpack，则可以添加别名：
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
...
'@': resolve('src'), // your source folder
}
}
然后可以导入：
import Poetry from '@/components/Poetry.vue'
import PoetryCard from '@/components/PoetryDetails/PoetryCard.vue'
import PoetrySearch from '@/components/PoetryDetails/Search.vue'
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句