컴포넌트가 정의되어 있지만 사용되지 않는 vars는 사용되지 않습니다.

컴포넌트가 정의되어 있지만 사용되지 않는 vars는 사용되지 않습니다.

저는 Vue CLI 프로젝트를 만들고 프로젝트를 시작했습니다.

다음 컴포넌트를 만들었습니다.Navigation.vue:

<template>
  <nav>
    <div class="nav_container">
      <a href="https://www.metrici.ro/" target="_blank" class="logo"></a>
      <ul>
        <li><router-link to="/home">Home</router-link></li>
        <li class="dropdown">
          <a class="touch"
            >Network Settings <i class="fas fa-angle-down"></i
            ><i class="fas fa-angle-up"></i
          ></a>
          <div class="dropdown-content">
            <router-link to="/dhcpIP">DHCP IP</router-link>
            <router-link to="/staticIP">Static IP</router-link>
          </div>
        </li>
        <!-- <li><router-link to="/files">Import/Export Files</router-link></li> -->
        <li><router-link to="/update">Update</router-link></li>
      </ul>
    </div>
  </nav>
</template>

<script>
export default {
    name: 'Navigation',
}
</script>
<style scoped>
/* Some style  */
</style>

그리고 나서 나는 그것을 수입했다.App.vue:

<template>
  <div id="app">
    <Navigation />
    <router-view />
  </div>
</template>

<script>
  import Navigation from "./components/Navigation.vue";
</script>

<style scoped>
  /* Some style  */
</style>

마침내 나는 가지고 있다main.js수정하지 않았습니다.

import App from './App.vue'
import router from './router'

Vue.config.productionTip = false

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

다음의 에러가 표시됩니다.

 ERROR  Failed to compile with 1 errors                                                                                    8:10:25 PM
 error  in ./src/App.vue

Module Error (from ./node_modules/eslint-loader/index.js):

\App.vue
  9:8  error  'Navigation' is defined but never used  no-unused-vars

부품은 확실히 사용되고 있습니다만, 그 에러가 발생하고 있습니다.나는 왜 그런지 이해하지 않아요.

Import 중Navigation스크립트에 사용하지 말고 컴포넌트로 선언합니다.

<template>
  <div id="app">
    <Navigation />
    <router-view />
  </div>
</template>

<script>
import Navigation from "./components/Navigation.vue";

export default {
  components: {
    Navigation 
  },
}
</script>
<style scoped>
/* Some style  */
</style>

언급URL : https://stackoverflow.com/questions/62027736/component-is-defined-but-never-used-no-unused-vars