How to install and use Momentjs in Vuejs

Install vue-moment for Install Momentjs example; In this tutorial you will learn how to install and use moment.js in Vue.js. The below examples show you moment js installation and setup in Vue using npm or yarn.

Moment Js is a JavaScript date library for parsing, validating, manipulating, and formatting dates. Let’s see how to use moment js for date base in vuejs.

Installation Momentjs in Vuejs

First install the moment.js package using the below commands.

You can install the momentjs using npm or yarn;

npm install moment --save   # npm
yarn add moment             # yarn

Use Moment js in Vue

Get current date using momentjs:

<template>
  <div id="app">
    <p>{{currentDate()}}</p>
  </div>
</template>

<script>
import moment from 'moment'

export default {
  methods: {
    currentDate() {
      return moment().format('MMMM Do YYYY')
    }
  }
};
</script>

Moment js to get current datetime:

// an instance of momentjs
var current = moment()

// unix timestamp:
var current = moment().unix()

// as ISO
var current = moment().toISOString()

Moment js to change Language:

<template>
  <div id="app">
    <p>{{BDTime()}}</p>
  </div>
</template>

<script>
import moment from 'moment'

export default {
  methods: {
    BDTime() {
      moment.locale("bn") // bengali

      return moment().format('LTS')
    }
  }
};
</script>

I hope its works for you.

Leave a Comment