Почему мой встроенный LESS sourceMap сломался?

Я успешно работал с LESS уже несколько недель, используя зависимость grunt-contrib-less (версия 0.11.4) в моем package.json и инициализируя ее в файле gruntfile. Карта генерируется встроенной в конце финального минимизированного файла styles.css.

Я был отстранен от этого проекта на несколько недель, и когда я вернулся к нему, вдруг ни один из моих браузеров не смог отобразить номера строк МЕНЬШЕ, и каждый стиль отображается на строку 1 (или, точнее, строку 5 как сгенерированную). файл имеет несколько строк в начале).

CSS компилируется нормально, и исходная карта явно находится в конце файла, но я больше не могу проверять и отлаживать файлы LESS в инструментах разработчика любого браузера.

Сначала у меня была какая-то посторонняя помощь в настройке gruntfile, и, к сожалению, эта помощь больше не доступна. Я новичок в Grunt и JSON и официально над моей головой. Как, черт возьми, я сломал это? Я на самом деле не связывался с включенным кодом, но я не уверен, что еще может вызывать проблемы с sourceMap.

Вот мой ворчливый код файла:

module.exports = function(grunt) {

  grunt.initConfig({
    less: {
      development: {
        options: {
          paths: ["less"],
          sourceMap: true,
          compress: true
        },
        files: {
          "dist/css/styles.css": "less/styles.less"
        }
      }
    },
    watch: {
      styles: {
        files: ["less/*.less"],
        tasks: ["less"]
      },
      javascripts: {
        files: ["js/**.js"],
        tasks: ['build']
      }
    },
    shell: {
      addstory: {
          command: function(arg) {
            return 'node node_scripts/addstory.js ' + arg;
          }
      }
    },
    concat: {
      dist: {
        src: ["js/lib/ie10-viewport-bug-workaround.js","js/lib/lazyload.min.js", "js/lib/jquery.dotdotdot.min.js", "js/lib/pointerevents.js", "js/lib/megafolio/js/jquery.themepunch.plugins.min.js", "js/lib/megafolio/js/jquery.themepunch.megafoliopro.js", "js/app.js"],
        dest: 'dist/js/main.js'
      }
    },
    uglify: {
      options: {
        mangle: false
      },
      dist: {
        files: {
          'dist/js/main.min.js': ['dist/js/main.js']
        }
      }
    }
  });

  grunt.loadNpmTasks('grunt-shell');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-jshint');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-concat');
  grunt.loadNpmTasks('grunt-contrib-less');

  grunt.registerTask('addstory', function(arg) {
    if (arg === undefined) {
      throw new Error('NO HTML FILE SPECIFIED!')
    } else {
      grunt.task.run('shell:addstory:'+arg);
    }
  });

  grunt.registerTask('build', ['concat', 'uglify']);

};

И package.json:

{
  "name": "ilium-web-bootstrap-team-ec",
  "version": "0.0.0",
  "description": "the ilium website redesign",
  "main": "dist/index.html",
  "dependencies": {
    "grunt": "^0.4.5",
    "grunt-contrib-clean": "^0.5.0",
    "grunt-contrib-compress": "^0.11.0",
    "grunt-contrib-concat": "^0.4.0",
    "grunt-contrib-connect": "^0.8.0",
    "grunt-contrib-copy": "^0.5.0",
    "grunt-contrib-csslint": "^0.2.0",
    "grunt-contrib-cssmin": "^0.10.0",
    "grunt-contrib-jshint": "^0.10.0",
    "grunt-contrib-less": "^0.11.4",
    "grunt-contrib-uglify": "^0.5.1",
    "grunt-contrib-watch": "^0.6.1",
    "grunt-shell": "^1.1.1",
    "jquery": "^2.1.1",
    "jsdom": "^0.11.1",
    "prompt": "^0.2.14"
  },
  "devDependencies": {},
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": " "
  },
  "author": "matt kristiansen and ryan juve",
  "license": "ISC"
}

Я надеюсь, что допустил какую-то распространенную ошибку, которая привела к невозможности увидеть LESS в инструментах разработки. Любое руководство?

1 ответ

Решение

Хорошо, урок здесь заключается в том, чтобы на самом деле замечать, когда ваша LESS-компиляция прерывается из-за синтаксических ошибок. Это как-то ускользнуло от моего внимания.

Оказывается, отсутствующая закрывающая фигурная скобка сломает sourceMaps, что имеет смысл.

Спасибо всем.

Другие вопросы по тегам