Desplegament d'una aplicació web des de Sublime Text 3
Contingut
Desplegament des de la línia de comandes
Tenim l'aplicació
de la qual disposem el codi font.
El desplegament en línia de comandes a un servidor al núvol és:
cd ~/projectes/OSM/quintana/html npm run build ssh ubuntu@vps-f5d83567.vps.ovh.net -f 'sudo chmod -R 777 /var/www/quintana/dist' cd ~/projectes/OSM/quintana/html/dist scp -r * ubuntu@vps-f5d83567.vps.ovh.net:/var/www/quintana/dist ssh ubuntu@vps-f5d83567.vps.ovh.net -f 'sudo chmod -R 755 /var/www/quintana/dist'
Per passos:
- anem al directori del projecte
- muntem (build) l'aplicació (amb parcel)
- dins del servidor web al núvol, donem permisos d'escriptura al directori Apache on està ubicada l'aplicació
- anem al directori dist/ on ha quedat muntada l'aplicació web.
- copiem (scp) el nostre projecte al servidor web
- treiem els permisos d'escriptura.
Desplegament des de l'editor Sublime Text 3
Cerquem quin és el plugin que pot resoldre la tasca. Una de les opcions és el plugin Shell Exec.
Run shell commands like git, rvm, rspec, ls, etc. with Bash, Zsh and others inside your Sublime Text 3.
Per instal·lar paquets a Sublime Text 3:
Tools > Command Palette
o bé
Open the Command Palette: Press Ctrl+Shift+P (Windows) or Cmd+Shift+P (OS X).
A la paleta de comandes posem Install, i aleshores ja podem cercar el paquet que volem instal·lar: Shell Exec
Podem veure que ja el tenim instal·lat:
Preferences > Package Control > List Packages
o bé Preferences > Package Settings > Package Control > Settings
Per definir els settings del meu nou plugin:
Preferences > Settings
i dins de les claus copio les opcions per defecte:
// Shell executable: "/bin/bash", "/bin/sh", "/usr/bin/zsh"... "shell_exec_executable": "/bin/bash", // Shell executable option: --login # Run as login load your ~/.bashrc or other user settings. "shell_exec_executable_option": "--login", // ["-l"] ["--login"] // The output of the command can be shown on the Panel or in a New File: "panel", "file" or "none". "shell_exec_output": "file", // Set the Output File Syntax. Default is Ruby, because Ruby looks nice. =) "shell_exec_output_syntax": "Ruby", // Enable or Disable the word wrap at the Output File. "shell_exec_output_word_wrap": true, // Enable or Disable the Debug infos (for plugin developers). "shell_exec_debug": false, // Name of the Shell Exec command box. "shell_exec_title": "Shell Exec", // Defines where the command should be executed: false, "project_folder" or "file_folder". // If "project_folder" is set, will execute: cd project_folder && your_commnad. "shell_exec_context": "project_folder",
I aleshores ja puc fer Ctrl+Shift+C, que és l'opció per defecte
S'ha d'obrir una línia de comandes a sota que posi Shell Exec, i puc executar una línia de comandes com ara
ls
Amb les opcions per defecte s'obrirà un nou fitxer de text amb la sortida de la comanda ls, doncs en les preferències per defecte hem posat l'opció:
"shell_exec_output": "file",
Els fitxers de configuració estan a:
/home/joan/.config/sublime-text-3/Packages/User
I si vull definir una drecera que executi una sèrie de comandes ho farem de la següent manera:
Preferences > Key Bindings
que de fet edita el fitxer User/Default (Linux).sublime-keymap
dins de la carpeta /home/joan/.config/sublime-text-3/Packages/User
i fem la prova que ens proposa el tutorial:
{
"keys": ["ctrl+shift+u", "ctrl+shift+p"],
"command": "shell_exec_open",
"args": {
"title": "Find Process",
"format": "ps aux | grep ${input}"
}
}
I ara fem ctrl-shift-u i p, i se'ns obre el Shell Exec, però ara amb el missatge Find Process. Entrem apache2 i obtenim com a sortida:
> ps aux | grep apache2 root 1107 0.0 0.2 198980 19108 ? Ss de gen.26 0:04 /usr/sbin/apache2 -k start www-data 1113 0.0 0.1 199444 8188 ? S de gen.26 0:00 /usr/sbin/apache2 -k start www-data 1114 0.0 0.1 199444 8188 ? S de gen.26 0:00 /usr/sbin/apache2 -k start www-data 1114 0.0 0.1 199444 8188 ? S de gen.26 0:00 /usr/sbin/apache2 -k start www-data 1114 0.0 0.1 199444 8188 ? S de gen.26 0:00 /usr/sbin/apache2 -k start www-data 1114 0.0 0.1 199444 8188 ? S de gen.26 0:00 /usr/sbin/apache2 -k start www-data 1115 0.0 0.1 199444 8188 ? S de gen.26 0:00 /usr/sbin/apache2 -k start www-data 1116 0.0 0.1 199444 8088 ? S de gen.26 0:00 /usr/sbin/apache2 -k start www-data 1117 0.0 0.1 199444 8088 ? S de gen.26 0:00 /usr/sbin/apache2 -k start joan 133161 0.0 0.0 12052 3472 ? S 10:32 0:00 /bin/bash --login -c ps aux | grep apache2 joan 133168 0.0 0.0 11608 660 ? S 10:32 0:00 grep apache2
Desplegament de l'aplicació des del Sublime
Per tant, ara ja estem en condicions de fer el desplegament de la nostra aplicació. Assignem la drecera ctrl+d+p:
Recordem quines eren les nostres comandes (afegim echo FI com a informació de què hem acabat):
cd ~/projectes/OSM/quintana/html npm run build ssh ubuntu@vps-f5d83567.vps.ovh.net -f 'sudo chmod -R 777 /var/www/quintana/dist' cd ~/projectes/OSM/quintana/html/dist scp -r * ubuntu@vps-f5d83567.vps.ovh.net:/var/www/quintana/dist ssh ubuntu@vps-f5d83567.vps.ovh.net -f 'sudo chmod -R 755 /var/www/quintana/dist' echo FI
Afegim una nova drecera a Preferences > Key Bindings
{
"keys": ["ctrl+shift+d", "ctrl+shift+p"],
"command": "shell_exec_run",
"args": {
"title": "Desplegar Quintana",
"format": "cd ~/projectes/OSM/quintana/html;npm run build;ssh ubuntu@vps-f5d83567.vps.ovh.net -f 'sudo chmod -R 777 /var/www/quintana/dist';cd ~/projectes/OSM/quintana/html/dist;scp -r * ubuntu@vps-f5d83567.vps.ovh.net:/var/www/quintana/dist;ssh ubuntu@vps-f5d83567.vps.ovh.net -f 'sudo chmod -R 755 /var/www/quintana/dist';echo FI"
}
}
I també canviem l'opció file per panel en les preferències generals (Preferences > Settings)
"shell_exec_output": "panel",
Ja podem desplegar la nostra aplicació fent Ctrl+D+P.
creat per Joan Quintana Compte, gener 2021
