web-dev-qa-db-fra.com

comment observer les modifications dans un répertoire / dossier complet contenant de nombreux fichiers sass

Comment pourrais-je suivre les modifications dans tout le répertoire contenant de nombreux fichiers sass? J'utilise la commande suivante pour observer les changements dans sass

fichier:

sass --watch style.scss:style.css

Mais comment observer les modifications dans un répertoire/dossier complet contenant de nombreux fichiers Sass.

csssassbuild-processwatch
66
Ankit

Utilisez simplement la commande sass --watch <input folder>:<output folder>, comme ça:

$ ls -l
css/ sass/
$ sass --watch sass:css

Où <input folder> contient les fichiers Sass et <output folder> qui héberge les fichiers CSS générés.

85
piouPiouM

Élargir un peu la réponse de piouPiouM:

  • Les fichiers de sortie seront créés avec les mêmes noms que les fichiers d’entrée, sauf qu’ils se terminent par .css.
  • <input folder> et <output folder> peut être la même chose.

  • Les deux dossiers peuvent être le répertoire de travail actuel. Les éléments suivants sont donc valides:

    $ sass --watch .:.

27
Gary Robertson

J'ai fini par le faire sans utiliser Grunt ou Sass-watch:

npm install -g watch
watch "sass assets/app.scss assets/dist/app.css" assets/css
9
matsko

Allez sur votre terminal et accédez à votre dossier puis a écrit:

 sass --watch .

cela va regarder tous les fichiers sass et convertir en fichiers CSS avec le même nom. aussi vous pouvez le faire de cette façon:

sass --watch ~/user/youUser/workspace/project/styles/

J'espère que ceci peut vous aider.

8
DaCrAn

si vous êtes dans votre dossier actuel, procédez comme suit pour le regarder.

F:\sass tutorial>sass --watch ./:./
3
saransh mehra

Vous pouvez créer un fichier sass incluant le reste des fichiers, puis regarder ce fichier.

Alternativement, regardez dans Grunt et le très bon grunt-contrib-compass plugin

1
kumarharsh

Selon les informations, vous pouvez utiliser la ligne de commande suivante:

sass --watch .

Source: http://sassbreak.com/watch-your-sass/#what-does---watch-do

1
Moises Portillo

Juste au cas où quelqu'un serait confronté à ce problème en 2018:
sass Site Web désigne Ruby Sass qui a été obsolète . et comme maintenant (mai 2018), si vous installez Dart sass via npm , il ne prend pas en charge --watch commande

Que faire:
vous devez installer node-sass globalement, comme:

npm install node-sass -g

puis redémarrez la ligne de commande, puis utilisez ce code:

node-sass --watch scss/styles.scss css/styles.css

compiler vos fichiers scass en css.
fondamentalement, node-sass supporte --watch commande et nous l’utilisons pour compiler nos codes scss en fichiers css normaux.

et juste au cas où vous obtenez une erreur comme celle-ci lors de la première sauvegarde de votre fichier .scss:

{
  "status": 3,
  "message": "File to read not found or unreadable: yourdirectory/scss/styles.scss",
  "formatted": "Internal Error: File to read not found or unreadable: yourdirectory/scss/styles.scss\n"
}

ce que vous devez faire est de le sauvegarder à nouveau, cela fonctionnera correctement!

1
a_m_dev