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: