NEW ARTICLE

Nuxt.js ライブラリ「vue-drag-resize」をインストールして要素をドラッグやリサイズする

Vue.js error: Duplicate key ‘components’ (no-dupe-keys)が発生した場合の対処法

2020.02.10
Vue.js
Vue.js

vue.jsで eslint利用時に「error: Duplicate key ‘components’」が発生した場合の対応方法。今回は、ただcomponentsが重複していただけ

1. 環境
2. 原因
3. 対処法

環境

OS CentOS 8.0.1905 (Core)
node v12.13.1
npm 6.13.2
@vue/cli 4.1.1

※CentOS8にVue.jsの環境構築はこちら

原因

componentsを同じものを2つ利用していただけ

components: {
    hello
  },
  data() {
    return {
      open: true
    }
  },
  components: {
    hello
  },

1

2

3

4

5

6

7

8

9

10

11

components: {

hello

},

data() {

return {

open: true

}

},

components: {

hello

},

対処法

当然ですが、どちらかを削除すれば解決します。

関連する記事

Vue.js vue-carouselを使用してスクロール機能を実装する 2020.01.18

vueのライブラリである「vue-carousel」を利用すると、簡単にスクロール機能が実装することが可能。目次 1. 環境 2. プロジェクト作[…]
Vue.js ライブラリ「vue-chartless」を利用して円グラフと棒グラフを作成する 2020.02.21

vue.jsのライブラリである「vue-chartless」をインストールすると、円グラフと棒グラフを簡単に作成することができます。ここでは、 v[…]
Vue.js v-ifとv-modelのサンプルコード 2019.11.01

v-ifとv-modelの基本的な使い方目次 1. 環境 2. 仕様 3. サンプルコード 4. main.js とindex.html 環境 OS[…]
Laravel6でvue.jsを利用する 2019.11.14

Laravel6だとvue.jsが自動で生成されないのでvue.jsを利用するための手順を記載。目次 1. 環境 2. Laravelプロジェクトの[…]
Vue.js Vue-Tree-Chartを利用してデータをツリーチャートで表示する 2020.01.15

tree-chartが簡単に実装できるVue-Tree-Chartを利用した簡単なサンプルコード目次 1. 環境 2. Vue.js環境構築 3. […]
Vue.jsのライブラリvue-carousel-cardをインストールしてカード型のカルーセルを実装する 2020.02.28

vue.jsのライブラリである「vue-carousel-card」を利用して、カード型のカルーセルの実装手順と簡単な使い方目次 1. 環境 2.[…]
Vue.js vue-accessibility-toolbarを利用してアクセシビリティツールバーを表示する 2020.02.20

vue.jsのライブラリである「vue-accessibility-toolbar」をインストールすると、アクセシビリティツールバーが利用できます[…]
Vue.js vue-functional-calendarを使用してカレンダーを実装する 2020.02.07

vueのライブラリである、軽量かつ高性能なカレンダー「vue-functional-calendar」の簡単な使い方。月や曜日の表記も日本語にすること[…]
Vue.js vue-particle-effect-buttonsを使ってアニメーションのかかったbuttonを実装する 2020.02.11

vue.jsのライブラリである「vue-particle-effect-buttons」をインストールすると、アニメーション付きのボタンを作成するこ[…]
Vue.js Vue-multiselectを利用してselectbox で複数選択を可能にする 2019.12.18

VueのライブラリVue-multiselectをインストールしてselectboxで複数選択できるようするまでの簡単なサンプルコードです。目次 1[…]

前の記事

zabbix_agentd.exe –start時にzabbix_agentd.exe [15588]: ERROR: cannot start service [Zabbix Agent]: [0x0000041D]が発生した場合の対処法 2020.02.09
次の記事

vue.jsライブラリ「vue-swatches」の簡単な使い方 2020.02.10

Vue.js error: Duplicate key ‘components’ (no-dupe-keys)が発生した場合の対処法

環境

原因

対処法

zabbix_agentd.exe –start時にzabbix_agentd.exe [15588]: ERROR: cannot start service [Zabbix Agent]: [0x0000041D]が発生した場合の対処法 2020.02.09

vue.jsライブラリ「vue-swatches」の簡単な使い方 2020.02.10