Nuxt.js组件自动导入功能失效问题求助

我在Vue文件中尝试使用Nuxt.js的组件自动导入功能，但无法正常工作。根据官方文档说明，只需在nuxt.config.js中设置components: true即可实现自动导入，但按此操作后并未生效，想确认是否正确配置了自定义Vue组件？

目录结构 #

Components
    >Timeline.vue
    >TimelineItem.vue

手动导入可正常运行的代码 #

手动导入组件的代码可以正常运行，但我希望移除script中的import语句实现自动导入：

<template id="timeline-template">
  <ul class="timeline">
    <li
      is="TimelineItem"
      v-for="(item, index) in items"
      :key="index"
      :item="item"
    ></li>
  </ul>
</template>

<script>
import TimelineItem from './TimelineItem.vue'
export default {
  components: { TimelineItem },
  props: ['items'],
}
</script>

修改后的代码（移除导入语句） #

于是我修改了script部分，移除了导入语句：

<script>
export default {}
</script>

同时在nuxt.config.js中设置：

components: true,

TimelineItem.vue代码 #

<template id="timeline-item-template">
  <li class="timeline-item">
    <div class="timeline-badge" :class="item.icon_status">
      <i :class="item.icon_class"></i>
    </div>
    <div class="timeline-panel">
      <div class="timeline-heading">
        <h4 class="timeline-title">{{ item.title }}</h4>
        <div class="timeline-panel-controls">
          <div class="controls">
            <a
              v-for="(control, index) in item.controls"
              :key="index"
              :control="control"
            >
            </a>
          </div>
          <div class="timestamp">
            <small class="text-muted">{{ item.created }}</small>
          </div>
        </div>
      </div>
      <div class="timeline-body">{{ item.body }}</div>
    </div>
  </li>
</template>

<script>
export default {
  props: ['item'],
}
</script>

更新尝试 #

我改用<TimelineItem/>替代is="TimelineItem"的写法，但仍然无法正常工作：

<template id="timeline-template">
  <ul class="timeline">
    <TimelineItem v-for="(item, index) in items" :key="index" :item="item" />
  </ul>
</template>

<script>
export default {
  props: ['items'],
}
</script>

解决建议 #

• 修正目录大小写：Nuxt组件自动导入对目录名称大小写敏感，官方规范是小写components，你当前用的大写Components会导致扫描失效，把目录名改成全小写即可。
• 重启开发服务：修改nuxt.config.js后必须重启Nuxt服务，配置才能生效，很多时候忽略这一步会导致配置不加载。
• 确认Nuxt版本：组件自动导入功能从Nuxt 2.13版本开始支持，若使用旧版本，需升级Nuxt或手动安装@nuxt/components模块并配置。
• 显式配置组件路径：如果自动扫描仍有问题，可在nuxt.config.js中显式指定组件目录：

components: [
  '~/components',
],

• 查看报错日志：打开浏览器控制台和Nuxt终端日志，组件未找到的报错信息会直接提示问题所在。

内容的提问来源于stack exchange，提问作者Henry