CODEWITHSUNDEEP
vue.jscomponentspackage.jsonquasar-framework
Dollique
Dollique

Reputation: 1012

How to get an object item from package.json in Vue / Quasar

I am trying to get the 'version' from package.json in my Vue/Quasar project.

There was an information in the internet to use this code:

import { version } from '../package.json'

Now I am a beginner and I cannot get this running. My current code looks somewhat like this:

<template>
  // ... REMOVED CODE FOR BETTER READABILITY

  <q-layout view="lHh Lpr lFf">
    <q-page-container>
      <div>VERSION: {{ version }}</div>
      <router-view />
    </q-page-container>
  </q-layout>
</template>

<script>
import { version } from '../package.json'
export default {
  name: 'Layout',

  data () {
    return {
      leftDrawerOpen: false
    }
  },
  components: {
    version
  }
}
</script>

ESLint throws the following error:

87:5 error The "version" component has been registered but not used vue/no-unused-components

How do I use the component variable I imported correctly?

Upvotes: 5

Views: 5391

Answers (2)

Dhananjaya Kumar Padmanaban
Dhananjaya Kumar Padmanaban

Reputation: 91

Follow these steps it will works fine

  1. import {version} from '../../package.json'
  2. data: () => ({ appVersion:version }),

  3. {{appVersion}}

(or)

Vue.prototype.application_version = require('../package.json').version;

Upvotes: 9

Onwuka Gideon
Onwuka Gideon

Reputation: 411

Remove this piece of code:

components: {
    version
}

You are trying to register it as a component which it is not.

Then add the version to vue:

data () {
   ...
   version: version
}

Upvotes: 2

Related Questions