envoi automatique d'un css sur le serveur via VSC

Hello :) Alors ça dépends, comment tu fait pour envoyer ton code sur le serveur? Quel type de serveur tu as?

Merci de ce retour,

J'envoi mon code via ftp-simple en sftp depuis vsc directement (lors de travaux en remote)

Quel type de serveur tu as? <- un serveur dédié -> de quelle information aurais tu besoin ?

Ca fonctionnait jusqu'alors mais a présent plus ..

merci

Okay alors pour commencer tu as un serveur statique, pas besoin d'envoyer le scss au serveur, il sera tout simplement ignoré, il faut juste envoyé le CSS :p

Ensuite pour envoyer automatiquement, tu utilises une extension VSC ou bien tu as un script? Tu as un fichier de config? tu peux me montrer le script/fichier de config ou me dire quelle extension tu utilisés?

tu utilises une extension VSC
J'ai installé LIVE Server et Live Sass Compiler

Tu as un fichier de config? tu peux me montrer le script/fichier de config

MERCI A TOI pour ton aide :)

De rien ^^

Bon je reposte juste ton fichier en propre et je regarde ça ;)

{
"editor.fontSize": 18,
"explorer.confirmDelete": false,
"window.zoomLevel": 1,
"liveSassCompile.settings.generateMap": false,
"liveSassCompile.settings.formats": [
    // {
    // "format": "expanded",
    // "extensionName": ".css",
    // "savePath": null
    // }
    {
    "format": "compressed",
    // "extensionName": ".min.css",
    "extensionName": ".css",
    "savePath": null
    }
],
"workbench.editor.showTabs": true,
"checkpoints.showActiveFileOnly": true,
"[php]": {
    "editor.defaultFormatter": "bmewburn.vscode-intelephense-client"
},
"workbench.tree.indent": 20,
"smarty.highlightColor": {
    // il est possible de désactiver cette surbrillance en faisant
    // Code > Préférences > Parametres > [rechercher SMARTY] > Décocher la case " Smarty Highlight "
    // "dark": "#0066ff18", // couleur de background du color smarty
    "dark": "#FFFA0010", // couleur de background du color smarty
},
"editor.detectIndentation": false,
"editor.fontFamily": "'Avenir', Menlo, Monaco, 'Courier New', monospace",
"editor.tabSize": 8,
"workbench.iconTheme": "material-icon-theme",
"[yaml]": {

    "editor.insertSpaces": true,
    "editor.tabSize": 8,
    "editor.autoIndent": "full"
},
"editor.minimap.scale": 2,
    "[css]": {
            "editor.defaultFormatter": "sibiraj-s.vscode-scss-formatter"
    },
    "[scss]": {
            "editor.defaultFormatter": "sasa.vscode-sass-format"
    },
    "better-comments.tags": [

            {
                    "tag": "!",
                    "color": "#FF2D00",
                    "strikethrough": false,
                    "underline": false,
                    "backgroundColor": "transparent",
                    "bold": false,
                    "italic": false
            },
            {
                    "tag": "?",
                    "color": "#ff9900",
                    "strikethrough": false,
                    "underline": false,
                    "backgroundColor": "transparent",
                    "bold": false,
                    "italic": false
            },
            {
                    "tag": "//",
                    "color": "#474747",
                    "strikethrough": true,
                    "underline": false,
                    "backgroundColor": "transparent",
                    "bold": false,
                    "italic": false
            },
            {
                    "tag": "bb",
                    "color": "#FF8C00",
                    "strikethrough": false,
                    "underline": false,
                    "backgroundColor": "transparent",
                    "bold": false,
                    "italic": false
            },
            {
                    "tag": "*",
                    "color": "#98C379",
                    "strikethrough": false,
                    "underline": false,
                    "backgroundColor": "transparent",
                    "bold": false,
                    "italic": false
            }
    ],
    "workbench.editor.untitled.hint": "hidden",
    // "bracketPairColorizer.depreciation-notice": false,
    "editor.bracketPairColorization.enabled": false,
    "liveSassCompile.settings.useNewCompiler": true,
    "liveSassCompile.settings.watchOnLaunch": true,
    "liveServer.settings.ChromeDebuggingAttachment": false,
    // "sass.format.convert": false,
    "liveSassCompile.settings.autoprefix": [

    ],
    "editor.guides.bracketPairs": true,
    "liveServer.settings.ignoreFiles": [
            ".vscode/**",
            "**/*.scss",
            "**/*.sass",
            "**/*.ts"
    ],
    "liveServer.settings.fullReload": true,
    "liveServer.settings.port": 0
}

Okay alors tu n'as pas définit le path où live sass compiler doit sauvegarder ton fichier :

    "savePath": null //Il faudrait mettre le path de ton fichier
    // css pour que ton sass écrase le fichier css que tu as actuellement,
    // et ça devrait être bon :p
    "savePath": "/path/to/css/file.css"

Bonjour Popotte,

mille fois désolé, de ne répondre que maintenant car je viens juste de prendre connaissance de ton post et t'en remercie.

je comprends le fait de devoir écraser le précédent fichier CSS, mais en remplacant dans le fichier de settings.json cela va remplacer pour toutes les config de tous les sites que je gére via SASS ?

D'ailleurs le fichier css est bel et bien généré dans mon cas... il n'est juste pas envoyé au serveur aprés avoir été écrasé/ remplacé

aussi ;

• comment connaitre MON "savePath" ?

Merci encore et désolé de ce retour tardif

bonne journée :)

Exemple de OUTPUT de live Sas Compile

envoi dans un même temps du fichier SCSS via FTP-SIMPLE
[2023-03-09 11:41:07] SFTP - xxxxxx.fr - kxxxx - Uploaded : /home/users/kxxxx/html/css/style_test.scss

Merci bien :)

Pas de soucis x)

Alors c'est bien que le CSS soit généré et qu'il écrases... Mais si il n'est pas envoyé au serveur alors ça ne sert à rien qu'il soit généré, ça concerne tous les fichiers qui ne vont pas au serveur: Ils servent à rien à part pour dev x)

Mmmmh okay alors pas possible d'utiliser le plugin, il n'est pas compatible avec ton site vu qu'il doit l'être avec les autres, tu utilises Github? si oui tu peux faire un worker pour que à chaque fois que tu push un commit sur la branche main ça déploie ton projet sur le serveur

Merci de ce retour,

il n'est pas compatible
Tu parles du plugin SASS live Compiler, c'est bien ca ?
Du coup, une fois compilé, je dois envoyer le fichier .css manuellement sur le serveur

tu utilises Github?
Non

C'est bizarre car tout fonctionnait bien avant la MAJ de certains plugin ..

Merci de ton aide en tout cas :)

Yep la maj a du écraser des valeurs par défaut de la config sur le plugin, compares le fichier de conf que tu as avec celle de l'ancienne version (tu peux retrouver sur Github, en principe tous les plugins sont open-source, tu regardes le fichier conf et ensuite tu switch vers le tag que tu avais avant et tu checkes si y'a eu du changement)

Ensuite la nouvelle version, t'as par exemple la version 1.2.3, entre l'ancienne et la nouvelle version du plugin, c'est quel niveau de tag qui a changé? le 1 le 2 ou le 3? si c'est le 1 alors c'est une maj cassante ^^'

Ah et aussi c'est qui les auteurs des deux plugins?

si c'est le 1 alors c'est une maj cassante ^^'
Actuellement j'ai la version 6.0.3, j'imagine donc que j'avais la précédente 5.x.x.... et donc "cassante"

du coup ?

Ca doit etre ça ^^

Quand la version est taggée comme cassante ça veut dire que si tu fais une MAJ faudra changer la config et la structure de ton projet pour l'adapter à la nouvelle version

Après tu as la version feature (2) qui indique que tu as des nouveaux outils que tu peux exploiter si tu veux

Et il y a le patch (3) en gros ça veut dire qu'il y avait un bug dans le plugin et il a été corrigé

Alors ce que tu peux faire c'est repasser à l'ancienne version, ensuite tu regardes dans la doc du plugin si il y a une migration guide, tu regardes le guides, tu fais les changement necessaires et ensuite tu remet à jour :p

Merci pour ce retour, mais la ca dépasse mes compétences :/

Ah okay ^^'

Bon alors restes en à la première étape: Retournes sur l'ancienne version ;)

Et t'inquiètes pas les devs opensource mettent à jour les anciennes version, par exemple si tu as un plugin version 5.2.1, il y aura une MAJ 5.3.1 à l'avenir, mais faut rester à la version 5 ^^

Merci, je viens d'essayer différentes anciennes versions, maisje ne retrouve pas le comportement d'avant ....
Je viens de trouver ce post où la personne a le probléme que moi semble t-il pour autant je n'ai pas compris la réponse ou solution apportée ?
https://stackoverflow.com/questions/72473511/css-auto-save-when-saved-scss-with-live-sass-compiler-extension

Merci a toi

Alors nope, il a un autre problème :p

En gros son exension ne target que le fichier main.scss, qui est un fichier maitre qui importe tous les autres fichiers scss, et en gros quand il fait un changement sur un des fichiers scss l'extension ne fait rien; il est obligé de faire un coup de save sur main.scss pour déclencher ^^'

Mmmmh, faut voir si l'ancienne version a réussit à écraser l'ancienne conf :/ donnes moi le nom des deux plugins avec le nom de leurs créateur/auteur, je vais checker sur Github

Merci pour les infos

donnes moi le nom des deux plugins

J'utilise pour le SCSS :
Live Sass Compiler v6.0.3 (mais d'autres versions sont possibles)
ftp-simple v0.7.6 (pour le remote)

Merci a toi

Et le nom des auteurs? (si tu vas dans extension et tu tu regardes la page des extensions ça devrait etre affiche sous les nom de l'extension (je suis sur Vim j'ai pas VSC pour regarder ^^')

ah oui pardon

Live Sass Compiler v6.0.3
Glenn Marks

ftp-simple v0.7.6
humy2833

Merci a toi

Ce que je ne comprends c'est que dans mon settings.json il a ceci

"liveServer.settings.ignoreFiles": [
                ".vscode/**",
                "**/*.scss",
                "**/*.sass",
                "**/*.ts"
        ],

et pour autant le fichier scss est bel et bien envoyé sur le serveur ???

Alors pas trop eu ule temps de voir le code je verrais après

Eu pour ta config ignore... C'est quoi ta structure de fichier? y a moyen qu'il faille faire **/**/*.scss

C'est quoi ta structure de fichier?
Lequel ?

y a moyen qu'il faille faire ''' //*.scss '''
non rien n'y fait :/

Merci a toi

de ton projet, en gros tes dossier, l'emplacement de ton fichier scss dans le projet x)

Okay alors en fait on s'en fiche du liveServer, c'est pour le local ^^'

En fait fallait se concentrer sur ftp-simple ^^'

possible de voir la config de FTP-simple? à et au fait tu as bien fais la config de ftp-simmple comme dans la doc: https://github.com/humy2833/FTP-Simple#startup-settings ?

Ah et aussi FTP-Simple c'est une version 0, ça veut dire que l'extension n'est pas finie elle est encore en beta :X

Et... en vrai je te conseillerais de chercher une autre extension, ça fait 2ans que le mec a abandonné le projet et qu'il n'est pas à jour, et en 7ans de développement du plugin il n'a jamais sorti de v1 :/

Merci

voici un extrait du fichier de confid de ftp-simple
'''
{
"name": "SFTP - domaineName - k000",
"host": "99.999.999.999",
"port": 22,
"type": "sftp",
"username": "k000",
"password": "xxxxxxxxx",
"path": "/home/users/k000/html/",
"autosave": true,
"confirm": false
},
'''

>> tu as bien fais la config de ftp-simmple
J'ai suivi ce tuto >> https://www.youtube.com/watch?v=9L1ciOkHSAQ

>>  je te conseillerais de chercher une autre extension
je vais regarder ca 

Merci a toi