Solucionado (ver solução)
Solucionado
(ver solução)
9
respostas

Aula 6 sobre imports

Depois que separei o código, não consigo compilar mais, dá o seguinte erro:

C:\Users\Rodrigo\Desktop\site-apeperia>grunt less Running "less:compilar" (less) task

NameError: .borda-arredondada is undefined in public/less/contato.less on lin e 15, column 3: 14 padding: 4px 8px; 15 .borda-arredondada(); 16 border: 2px solid #ccc; Warning: Error compiling public/less/contato.less Use --force to continue.

Aborted due to warnings.

C:\Users\Rodrigo\Desktop\site-apeperia>

Já tentei de várias formas e não consigo resolver.

9 respostas

Só para complementar, é como se ele não enxergasse as variáveis que importei.

Meu Gruntfile.js, se eu colocar tudo em um arquivo só, sem separar o código funciona.

module.exports = function(grunt) {

   grunt.initConfig({
      /* Copia os arquivos para o diretório 'dist' */
      copy: {
         public: {
           expand: true,
           cwd: 'public',
           src: '**',
           dest: 'dist'
         }
     },

     clean: {
          dist: {
              src: 'dist'
          }
     },

     useminPrepare: {
       html: 'dist/**/*.html'
     },

     usemin: {
       html: 'dist/**/*.html'
     }, 

     imagemin: {
      public: {
        expand: true,
        cwd: 'dist/imagens',
        src: '**/*.{png,jpg,gif}',
        dest: 'dist/imagens'
      }
    }, 

    rev: {
      options: {
        encoding: 'utf8',
        algorithm: 'md5',
        length: 8
      },

      imagens: {
        src: ['dist/imagens/**/*.{png,jpg,gif}']
      },
      minificados: {
        src: ['dist/js/**/*.min.js', 'dist/css/**/*.min.css']
      }
    }, 

    coffee: {
      compilar: { 
        expand: true,
        cwd: 'public/coffee', 
        src: ['**/*.coffee'],
        dest: 'public/js', 
        ext: '.js'
      }
    },

    less: {
      compilar: {
        expand: true,
        cwd: 'public/less',
        src: ['**/*.less'],
        dest: 'public/css', 
        ext: '.css'
      }
    }, 

    watch: {
      coffee: {
        options: {
          event: ['added', 'changed']
        },
        files: 'public/coffee/**/*.coffee',
        tasks: 'coffee:compilar'
      },

      less: {
        options: {
          event: ['added', 'changed']
        },
        files: 'public/less/**/*.less', 
        tasks: 'less:compilar'
      },

      js: {
        options: {
          event: ['changed']
        },
        files: 'public/js/**/*.js', 
        tasks: 'jshint:js'
      }
    }, 

    jshint: {
      js: {
        src: ['public/js/**/*.js']
      }
    }, 

    browserSync: {
      public: {
        bsFiles: {
          src : ['public/**/*']
        }, 
        options: {
            watchTask: true,
            server: {
                baseDir: "public"
            }
        }
      }
    }

  });

  //registrando task para minificação

  grunt.registerTask('dist', ['clean', 'copy']);

  grunt.registerTask('minifica', ['useminPrepare', 
                                  'concat', 'uglify', 'cssmin', 'rev:imagens','rev:minificados', 'usemin', 'imagemin']);

  grunt.registerTask('server', ["browserSync", "watch"]);

  // registrando tasks
  grunt.registerTask('default', ['dist', 'minifica', ]);

  // carregando tasks
  grunt.loadNpmTasks('grunt-contrib-copy'); 
  grunt.loadNpmTasks('grunt-contrib-clean');
  grunt.loadNpmTasks('grunt-contrib-concat');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-cssmin');
  grunt.loadNpmTasks('grunt-usemin'); 
  grunt.loadNpmTasks('grunt-contrib-imagemin'); 
  grunt.loadNpmTasks('grunt-rev'); 
  grunt.loadNpmTasks('grunt-contrib-coffee');
  grunt.loadNpmTasks('grunt-contrib-less');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-jshint');
  grunt.loadNpmTasks('grunt-browser-sync');
}

Alguém para ajudar? Quando separo os arquivos o grunt não lê variáveis que estão nos arquivos separados. O que pode ser?

Oi Rodrigo,

Peguei a sua task 'less', coloquei no Gruntfile que disponibilizei na aula e o LESS compilou sem problemas.

Você poderia disponibilizar um ZIP com todos os arquivos (exceto a pasta node_modules)? Pode colocar no Dropbox ou algo do gênero e colocar o link aqui.

Abcs!

Olá Natan,

Segue link: https://drive.google.com/file/d/0B90IR-riynGlNEluU1NDUzg2ekk/view?usp=sharing

Oi Rodrigo,

Peguei seu código e dei os comandos 'grunt' e 'grunt less', em ambos fez o build sem nenhum erro.

Faz um teste pra mim por favor? Tenta usar esse Gruntfile e ver se ele faz tudo certinho.

Abcs!

Não funcionou! Você pode me passar o projeto inteiro em um arquivo .zip? Pq, não funciona!

solução!

Consegui aqui, refiz do zero seguindo as instruções do curso de Grunt e funcionou.

Maravilha então!

Bons estudos, Rodrigo!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software