Utilisation de Compass sous Windows avec Visual Studio C # et ASP.NET

Question

Quelqu'un a-t-il déjà développé Compass pour CSS / SASS dans un environnement C # ASP.NET standard?

Existe-t-il une seule distribution téléchargeable prête à utiliser Windows ou dois-je installer chaque élément de l'équation et créer moi-même une boussole?

Existe-t-il des plugins qui rendent le développement avec Compass plus convivial avec VS2008, tels que la gestion automatique de Compass / SASS dans les versions, la coloration syntaxique et / ou le support intellisense?

S'il n'y a pas de plug-in VS IDE, quelles sont les meilleures options pour un éditeur de texte autonome permettant de gérer le codage dans Compass?

Answer 1

Pour compléter les dernières réponses, vous pouvez installer Web Workbench , un plugin pour Visual Studio 2010 qui ajoute la mise en surbrillance de la syntaxe , la intellisence et quelques autres éléments du langage SASS (syntaxe SCSS uniquement).

Si vous préférez utiliser Compass et / ou certains autres outils pour compiler votre CSS, vous devez désactiver le compilateur intégré. J'ai répertorié ici d'autres compilateurs SASS: Utiliser SASS avec ASP.NET .

Pour désactiver le compilateur intégré: sélectionnez le fichier .scss dans l'Explorateur de solutions, accédez à la fenêtre Propriétés et supprimez le texte de la zone Outil personnalisé.

Depuis Web Workbench 3, vous pouvez maintenant gérer plus facilement ce que vous voulez compiler avec ce plugin. Voir le Mindscape > Élément de menu Paramètres de Web Workbench.

Answer 2

Débuter avec Compass,

D'abord, oui, je dois installer Ruby et le compas source et compiler ma version de compas. J'ai suivi les instructions du wiki de Compass Mise en route .

Après avoir installé Compass et toutes ses dépendances, j'ai créé mon premier projet.

compass -f blueprint project-name

Qui crée un projet par défaut avec la boussole pour le framework blueprint css, il existe actuellement un bogue dans la boussole avec la création du fichier grid.png dans le répertoire images de la boussole. Vous devez donc copier le fichier grid.png original à partir du fichier source. dossier

C:\Ruby\lib\ruby\gems\1.8\gems\chriseppstein-compass-0.8.10
    \frameworks\blueprint\templates\project

Ou un fichier similaire situé en fonction de l'emplacement où vous avez tout installé. L’un des changements les plus importants pour que l’OMI utilise Compass sur asp.net consiste à modifier la directive SASS CACHE relative à Compass. SASS CACHE crée un groupe de dossiers temporaires dans le répertoire de votre projet, dont les résultats seraient probablement médiocres s’ils se terminaient sous le contrôle de la source. Alors ouvrez config.rb et ajoutez cette ligne

sass_options = {:cache_location => 
    "#{Compass.configuration.project_path}\\tmp\\sass-cache"} 

Assurez-vous de noter les barres obliques inverses échappées.

Après cela, j'ai modifié les noms des dossiers que compas utilise pour définir comment je voulais qu'ils soient nommés dans config.rb et j'ai commencé à y accéder avec SASS et Compass. Je recommande de regarder l’introduction d’une heure à la boussole vidéo. C’est très utile et j’en ai appris beaucoup: Regarder la diffusion d'écran .

Cela m’a montré comment régler la boussole pour surveiller les modifications du système de fichiers et compiler automatiquement sass en css. En utilisant

compass -w

Cela fonctionne très bien pour moi. Assurez-vous simplement de garder vos fichiers CSS extraits ou de les désactiver en lecture uniquement s'ils sont sous contrôle de source si votre projet ne prend pas en charge les extractions simultanées.

Pour l’édition, j’utilise SciTE, fourni par défaut avec Ruby pour les fichiers config.rb ou uniquement la fenêtre d’éditeur de VS2008. Pour Sass, je suis tombé sur une grande liste sur le site Web de HAML . jEdit avec le fichier de syntaxe en surbrillance pour SASS est ce que j’ai utilisé après avoir essayé quelques-uns. J'aimerais toujours trouver un plug-in VS pour la coloration syntaxique, donc je n'ai pas besoin d'utiliser un autre éditeur, mais jEdit est en train de faire le travail.

Answer 3

Ma réponse est un peu dépassée. Avant de suivre ma réponse initiale, je recommanderais d'explorer le paquet Nuget SassAndCoffee. Vous trouverez tous les détails ici .

  

Comment ça marche?

     

SassAndCoffee intègre l'original   compilateurs dans la DLL en tant que (Sass 3.2.0   et CoffeeScript 1.1.0 à partir de cette   écrit) et utilise IronRuby et   Jurassique respectivement pour exécuter le   compilateurs contre votre source.

     

Pourquoi est   cela mieux que [SOMEOTHERPROJECT]?

No external processes are executed
You don’t have to install Ruby or node.js
It’s in NuGet so you don’t have to fiddle with web.config
Files are cached and are rebuilt as-needed.

Answer 4

Je voulais ajouter une autre alternative ici. Si vous voulez simplement vous assurer que Compass construit les fichiers sass et inclut les fichiers css lorsque vous générez votre projet ASP.net, vous pouvez ajouter les éléments suivants à votre fichier de projet (csproj) dans la section projet:

<Target Name="AfterBuild" Condition="'$(Configuration)' == 'Release' ">
   <Exec Command="compass compile --output-style compressed --force" />
   <ItemGroup>
      <Content Include="Styles\*.css" />
   </ItemGroup>
</Target>
<Target Name="AfterCompile" Condition=" '$(Configuration)' == 'Debug' ">
    <Exec Command="compass compile" />
    <ItemGroup>
      <Content Include="Styles\*.css" />
   </ItemGroup>
</Target>

La première cible est pour Release et compresse également le css, l'autre est pour Debug.

Si vous souhaitez personnaliser les chemins, ajoutez un fichier config.rb au dossier racine du projet:

css_dir = "Content"
sass_dir = "Content/Sass"

Tout cela nécessite bien sûr que compas et ruby ??soient installés et sur le chemin de votre machine.