Ext.js - Configurazione dell'ambiente

Configurazione dell'ambiente locale

Questa sezione ti guida su come scaricare e configurare Ext JS sulla tua macchina. Segui i passaggi per configurare l'ambiente.

Download dei file di libreria

Scarica la versione di prova dei file della libreria Ext JS da Sencha https://www.sencha.com. Otterrai la versione di prova dal sito sul tuo ID di posta registrato, che sarà una cartella compressa denominata ext-6.0.1-trial.

Decomprimi la cartella e troverai vari file JavaScript e CSS, che includerai nella nostra applicazione. Includeremo principalmente i seguenti file:

JavaScript Files - Il file JS che puoi trovare nella cartella \ ext-6.0.1-trial \ ext6.0.1 \ build sono -

Suor n Descrizione del file
1

ext.js

Questo è il file principale che contiene tutte le funzionalità per eseguire l'applicazione.

2

ext-all.js

Questo file contiene tutto il codice minimizzato senza commenti nel file.

3

ext-all-debug.js

Questa è la versione non ridotta di ext-all.js a scopo di debug.

4

ext-all-dev.js

Anche questo file non è minimizzato e viene utilizzato per scopi di sviluppo in quanto contiene tutti i commenti e i registri della console per verificare eventuali errori / problemi.

5

ext-all.js

Questo file viene utilizzato per scopi di produzione principalmente poiché è molto più piccolo di qualsiasi altro.

È possibile aggiungere questi file alla cartella JS dei progetti oppure fornire un percorso diretto in cui risiede il file nel sistema.

CSS Files - Esistono numerosi file basati su temi, che puoi trovare nella cartella \ ext6.0.1-trial \ ext-6.0.1 \ build \ classic \ theme-classic \ resources \ theme-classic-all.css

  • Se intendi utilizzare l'applicazione desktop, puoi utilizzare i temi classici nella cartella \ ext-6.0.1-trial \ ext-6.0.1 \ build \ classic

  • Se utilizzeremo l'applicazione mobile, puoi utilizzare temi moderni che possono essere trovati nella cartella \ ext-6.0.1-trial \ ext-6.0.1 \ build \ modern

I seguenti file di libreria verranno aggiunti in un'applicazione Ext JS.

<html>
   <head>
      <link rel = "stylesheet" type = "text/css" 
         href = "..\ext-6.0.1-trial\ext-6.0.1\build\classic\theme-classic\resources\theme-classic-all.css" />
      <script type = "text/javascript" 
         src = "..\ext-6.0.1-trial\ext-6.0.1\build\ext-all.js" > </script>
      <script type = "text/javascript" src = "app.js" > </script>
   </head>
</html>

Manterrai il codice dell'applicazione ExtJS nel file app.js.

Configurazione CDN

CDN è una rete di distribuzione dei contenuti con la quale non è necessario scaricare i file della libreria Ext JS, ma è possibile aggiungere direttamente il collegamento CDN per ExtJS al programma come segue:

<html>
   <head>
      <link rel = "stylesheet" type = "text/css" 
         href = "https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/classic/theme-crisp/resources/theme-crisp-all.css" / >
      <script type = "text/javascript" 
         src = "https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/ext-all.js"> </script>
      <script type = "text/javascript" src = "app.js" > </script> 
   </head>
</html>

Redattori popolari

Trattandosi di un framework JavaScript, che viene utilizzato per lo sviluppo di applicazioni web, nel nostro progetto avremo file HTML, JS. Per scrivere i nostri programmi Ext JS, avremo bisogno di un editor di testo. Ci sono anche più IDE disponibili sul mercato. Ma per ora, possiamo considerare uno dei seguenti:

  • Notepad - Su un computer Windows, puoi utilizzare qualsiasi semplice editor di testo come Blocco note (consigliato per questo tutorial), Blocco note ++, sublime.

  • Eclipse - È un IDE sviluppato dalla comunità open source di eclipse e può essere scaricato da https://www.eclipse.org/.

Browser

Ext JS supporta la compatibilità cross-browser, supporta tutti i principali browser come:

  • IE 6 e versioni successive
  • Firefox 3.6 e versioni successive
  • Chrome10 e versioni successive
  • Safari 4 e versioni successive
  • Opera 11 e versioni successive

È possibile utilizzare qualsiasi browser per eseguire l'applicazione Ext JS.