feat: add moment of npm module and add to use memont().utcOffset('+0900')

Author: hisasann

package.json

@@ -58,6 +58,7 @@
     "cross-env": "^5.2.0",
     "express": "^4.16.4",
     "js-cookie": "^2.2.0",
+    "moment": "^2.24.0",
     "nuxt": "^2.6.2",
     "nuxt-client-init-module": "^0.1.4",
     "nuxt-env": "^0.1.0",
@@ -77,6 +78,7 @@
     "@types/express": "^4.16.1",
     "@types/jest": "^24.0.11",
     "@types/js-cookie": "^2.2.2",
+    "@types/moment": "^2.13.0",
     "@types/prettier": "1.16.2",
     "@types/storybook__vue": "^5.0.1",
     "@typescript-eslint/eslint-plugin": "^1.6.0",

src/assets/styles/main.scss

@@ -34,3 +34,10 @@
   opacity: 0;
   transform: translate(-30px, 0);
 }
+
+h1.title {
+  font-size: 20px;
+  margin-bottom: 10px;
+  padding-left: 3px;
+  border-left: 2px solid blueviolet;
+}

src/pages/example/index.vue

@@ -1,9 +1,9 @@
 <template lang="pug">
 section
-  h1.red
+  h1.title
     | example index page
-    |  - nuxtServerInit has been called is {{ isServerInitCalled }}
-    |  - nuxtClientInit has been called is {{ isClientInitCalled }}
+  p nuxtServerInit has been called is {{ isServerInitCalled }}
+  p nuxtClientInit has been called is {{ isClientInitCalled }}
   hr
   p
     nuxt-link(to='/example/auth/require-auth') require-auth
@@ -47,6 +47,8 @@ section
     nuxt-link(to='/example/i18n') i18n
   p
     nuxt-link(to='/example/animejs') animejs
+  p
+    nuxt-link(to='/example/now-utcoffset') now-utcoffset
 </template>
 
 <script lang="ts">
@@ -65,12 +67,7 @@ export default class extends Vue {
 </script>
 
 <style lang="scss" scoped>
-.red {
-  margin: 5px;
-  color: red;
-}
-
 p {
-  margin: 5px;
+  margin-bottom: 5px;
 }
 </style>

src/pages/example/now-utcoffset.vue

@@ -0,0 +1,39 @@
+<template lang="pug">
+section.container
+  h1.title
+    | now-utcoffset
+  p now: {{ now }}
+  p from-string: {{ fromString }}
+  p now-date: {{ nowDate }}
+</template>
+
+<script lang="ts">
+import { Component, Vue } from 'nuxt-property-decorator'
+import moment from 'moment'
+
+@Component
+export default class extends Vue {
+  public get now(): string {
+    const dayWrapper = moment(new Date()).utcOffset('+0900')
+    return dayWrapper.format()
+  }
+
+  public get fromString(): string {
+    const dayWrapper = moment('2013-03-07T07:00:00+09:00').utcOffset('+0900')
+    return dayWrapper.format()
+  }
+
+  public get nowDate(): string {
+    const dayWrapper = moment(new Date()).utcOffset('+0900')
+    return dayWrapper.format('YYYY-MM-DD')
+  }
+
+  public head() {
+    return {
+      title: 'now-utcoffset'
+    }
+  }
+}
+</script>
+
+<style lang="scss"></style>

yarn.lock

@@ -2246,6 +2246,13 @@
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/@types/mime/-/mime-2.0.1.tgz#dc488842312a7f075149312905b5e3c0b054c79d"
 
+"@types/moment@^2.13.0":
+  version "2.13.0"
+  resolved "https://registry.yarnpkg.com/@types/moment/-/moment-2.13.0.tgz#604ebd189bc3bc34a1548689404e61a2a4aac896"
+  integrity sha1-YE69GJvDvDShVIaJQE5hoqSqyJY=
+  dependencies:
+    moment "*"
+
 "@types/node@*":
   version "11.9.5"
   resolved "https://registry.yarnpkg.com/@types/node/-/node-11.9.5.tgz#011eece9d3f839a806b63973e228f85967b79ed3"
@@ -8314,6 +8321,11 @@ mkdirp@0.5.1, mkdirp@0.x, "mkdirp@>=0.5 0", mkdirp@^0.5.0, mkdirp@^0.5.1, mkdirp
   dependencies:
     minimist "0.0.8"
 
+moment@*, moment@^2.24.0:
+  version "2.24.0"
+  resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b"
+  integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg==
+
 move-concurrently@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/move-concurrently/-/move-concurrently-1.0.1.tgz#be2c005fda32e0b29af1f05d7c4b33214c701f92"