MomentJS - Configurazione dell'ambiente

In questo capitolo imparerai in dettaglio come configurare l'ambiente di lavoro di MomentJS sul tuo computer locale. Prima di iniziare a lavorare su MomentJS, devi avere accesso alla libreria. È possibile accedere ai suoi file in uno dei seguenti metodi:

Metodo 1: utilizzo del file MomentJS nel browser

In questo metodo, avremo bisogno del file MomentJS dal suo sito Web ufficiale e lo utilizzeremo direttamente nel browser.

Passo 1

Come primo passo, vai al sito ufficiale di MomentJS https://momentjs.comTroverai la home page come mostrato qui -

Osserva che è disponibile un'opzione di download che ti dà l'ultimo file MomentJS disponibile. Notare che il file è disponibile con e senza minimizzazione.

Passo 2

Ora includi moment.js dentro il scripttag e inizia a lavorare con MomentJS. Per questo, puoi utilizzare il codice fornito di seguito:

<script type = "text/JavaScript" src = " https://MomentJS.com/downloads/moment.js"></script>

Qui viene fornito un esempio funzionante e il suo output per una migliore comprensione -

Esempio

<html>
   <head>
      <title>MomentJS - Working Example</title>
      <script type = "text/JavaScript" src = "https://MomentJS.com/downloads/moment.js"></script>
      <style>
         div {
            border: solid 1px #ccc;
            padding:10px;
            font-family: "Segoe UI",Arial,sans-serif;
            width: 50%;
         }
      </style>
   </head>
   <body>
      <div style = "font-size:25px" id = "todaysdate"></div>
      <script type = "text/JavaScript">
         var a = moment().toString();
         document.getElementById("todaysdate").innerHTML = a;
      </script>
   </body>
</html>

Produzione

Il moment-localeè disponibile anche un file per lavorare con diverse localizzazioni, come mostrato nello screenshot qui sopra. Ora aggiungi il file al tag script come mostrato di seguito e lavora con diverse impostazioni locali di tua scelta. Per questo, puoi utilizzare il codice fornito di seguito:

<script type="text/JavaScript" src="https://MomentJS.com/downloads/moment-with-locales.js"></script>

Qui viene fornito un esempio funzionante per moment-locale e il suo output per una migliore comprensione -

<html>
   <head>
      <script type = "text/JavaScript" src ="https://MomentJS.com/downloads/moment-with-locales.js"></script>
   </head>
   <body>
      <h1>Moment Locale</h1>
      <div id = "datedisplay" style = "font-size:30px;"></div>
      <script type = "text/JavaScript">
         var a = moment.locale("fr");
         var c = moment().format("LLLL");
         document.getElementById("datedisplay").innerHTML = c;
      </script>
   </body>
</html>

Produzione

Metodo 2: utilizzo di Node.js

Se stai optando per questo metodo, assicurati di averlo fatto Node.js e npminstallato sul tuo sistema. È possibile utilizzare il seguente comando per installare MomentJS:

npm install moment

È possibile osservare il seguente output una volta installato correttamente MomentJS:

Ora, per verificare se MomentJS funziona bene con Node.js, crea il file test.js e aggiungi il seguente codice ad esso -

var moment = require('moment');
var a = moment().toString();
console.log(a);

Ora, nel prompt dei comandi, esegui il nodo di comando test.js come mostrato nello screenshot riportato di seguito -

Notare che questo comando visualizza l'output per moment().toString().

Metodo 3: utilizzo di Bower

Bower è un altro metodo per ottenere i file richiesti per MomentJS. È possibile utilizzare il seguente comando per installare MomentJS utilizzando Bower -

bower install --save moment

Lo screenshot riportato di seguito mostra l'installazione di MomentJS utilizzando Bower -

Questi sono i file caricati da Bower per MomentJS da installare. Il momento installato ei file delle impostazioni locali sono mostrati nell'immagine riportata di seguito: