CODEWITHSUNDEEP
datevue.jsdatepicker
Adam Adams
Adam Adams

Reputation: 63

How to import moment.js into vue

I am trying to use moment.js within a very simple vue build. I have added moment.js to the body of my index page, but when i try to use moment.js I keep getting the console error "ReferenceError: moment is not defined".

// registering the date picker
  components: {
    vuejsDatepicker,
},    


// the component with some props 
<vuejs-datepicker
                    :value="this.default"
                    name="datepicker"
                    :clear-button="true"
                    :typeable="true"
                    v-model="GetPaymentDate"
                    :format="customFormatter"
                    input-class="form-control"
                    ></vuejs-datepicker>

 methods: {

 // the method to produce formated date
    customFormatter(date) {
      return moment(date).format('MMMM Do YYYY, h:mm:ss a');
    }
},

// where Im trying to display formated date - this is the bit that breaks things - the | formatDate
<p>The delivery Date is <b>{{ GetPaymentDate | formatDate}}</b></p>


// the order of my scripts on the index file 
<script src="vue-moment.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"> . </script>
<script src="https://unpkg.com/vuejs-datepicker"></script>

Upvotes: 1

Views: 1500

Answers (1)

Amitha Mahesh
Amitha Mahesh

Reputation: 347

simply add the below line. you can add it inside the main.js or the component file

import moment from 'moment';

Upvotes: 1

Related Questions