2016-09-12 1 views
0

J'ai commencé à travailler sur un site Web existant au travail qui utilise Sass et le préfixe automatique avec Grunt. Je ne suis pas encore familier avec les fichiers, mais je ne veux pas changer la structure pour éviter de casser quoi que ce soit. Le problème que j'ai est que peu importe ce que les fichiers .scss je édite, cela n'affecte pas le fichier .css requis. Les développeurs qui ont initialement construit le site ne sont plus là. Les modifications que j'effectue affectent file.css ou file2.css, et j'ai besoin d'atteindre file.expanded.css, mais il n'y a aucune mention de ce fichier dans le fichier Gruntfile, donc il a été retiré, ou il est en train d'être compilé d'une autre manière. Évidemment, j'évite de l'éditer directement. Je ne sais pas si j'en ai assez pour comprendre ça.Impossible de trouver les fichiers source

Dans le cas où il aide, voici le Gruntfile:

module.exports = function(grunt){ 

    require("matchdep").filterDev("grunt-*").forEach(grunt.loadNpmTasks); 

    grunt.initConfig({ 
    pkg: grunt.file.readJSON('package.json'), 

    sass: { 
     build: { 
     files: { 
      'assets/css/file2.css': 'assets/sass/folder/file2.sass' 
     } 
     } 
    }, 

    autoprefixer: { 
     build: { 
     src: 'assets/css/file.css', 
     dest: 'assets/css/file.css' 
     } 
    }, 

    watch: { 
     css: { 
     files: ['assets/sass/**'], 
     tasks: ['buildcss'] 
     } 
    }, 

    // Browsersync 
    browserSync: { 
     dev: { 
      bsFiles: { 
       src: [ 
        'assets/css/*.css', 
        'assets/images/*', 
        'assets/scripts/*.js', 
        '**/*.html' 
       ] 
      }, 
      options: { 
       watchTask: true, 
       proxy: "site.dev:8888", 
      } 
     } 
    }, 
    }); 

    grunt.registerTask('default', ['browserSync', 'watch']); 
    grunt.registerTask('buildcss', ['sass', 'autoprefixer']); 

}; 

Répondre

0

Vous devez installer une tâche Grunt pour les cartes de source et recompiler votre CSS. Personnellement, j'utilise Gulp, donc je ne sais pas quelle pourrait être la meilleure solution pour Grunt, mais c'est une configuration similaire. Lorsque votre code CSS est compilé avec des cartes source, vous pouvez identifier avec votre inspecteur l'endroit d'où proviennent les déclarations de style dans quel fichier partiel ou SASS.

http://thesassway.com/intermediate/using-source-maps-with-sass