VueJS - Configurazione dell'ambiente

Esistono molti modi per installare VueJS. Alcuni dei modi su come eseguire l'installazione sono discussi in seguito.

Utilizzando il tag <script> direttamente nel file HTML

<html>
   <head>
      <script type = "text/javascript" src = "vue.min.js"></script>
   </head>
   <body></body>
</html>

Vai al sito principale https://vuejs.org/v2/guide/installation.htmldi VueJS e scarica vue.js secondo necessità. Sono disponibili due versioni: la versione di produzione e la versione di sviluppo. La versione di sviluppo non è ridotta a icona, mentre la versione di produzione è ridotta a icona come mostrato nello screenshot seguente. La versione di sviluppo aiuterà con gli avvisi e la modalità di debug durante lo sviluppo del progetto.

Utilizzando CDN

Possiamo anche iniziare a utilizzare il file VueJS dalla libreria CDN. Il linkhttps://unpkg.com/vuedarà l'ultima versione di VueJS. VueJS è disponibile anche su jsDelivr (https://cdn.jsdelivr.net/npm/vue/dist/vue.js) e cdnjs (https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.0/vue.js).

Possiamo ospitare i file da noi, se necessario, e iniziare con lo sviluppo di VueJS.

Utilizzando NPM

Per applicazioni su larga scala con VueJS, si consiglia di installare utilizzando il pacchetto npm. Viene fornito con Browserify e Webpack insieme ad altri strumenti necessari, che aiutano con lo sviluppo. Di seguito è riportato il comando per installare utilizzando npm.

npm  install vue

Utilizzo della riga di comando della CLI

VueJS fornisce anche la CLI per installare la vue e iniziare con l'attivazione del server. Per installare utilizzando la CLI, è necessario aver installato la CLI, che viene eseguita utilizzando il seguente comando.

npm install --global vue-cli

Una volta terminato, mostra la versione CLI per VueJS. Ci vogliono pochi minuti per l'installazione.

+ [email protected]
added 965 packages in 355.414s

Di seguito è riportato il comando per creare il progetto utilizzando Webpack.

vue init webpack myproject

Per iniziare, utilizza il seguente comando.

cd myproject
npm install
npm run dev

Una volta eseguito npm run dev, avvia il server e fornisce l'URL da visualizzare nel browser che è come mostrato nello screenshot seguente.

La struttura del progetto che utilizza la CLI è simile alla seguente.