Меньше абсолютных путей к файлам SourceMap с использованием Grunt

У меня есть файловая структура, которая выглядит так (упрощено для краткости):

/less/
     /styles.less
/public/
       /css/
           /styles.css
           /styles.css.map
/gruntfile.js

Gruntfile.js:

less: {
    options: {
        sourceMap: true,
        sourceMapFilename: 'public/css/styles.css.map',
        sourceMapURL: 'less/styles.less'
    }
    files: {
        'public/css/styles.css': 'less/styles.less'
    }
}

В html-файле: <link rel="stylesheet" href="/css/styles.css">

Теперь проблема в том, что в инструментах разработки styles.less указывает на /css/less/styles.less. Это явно не так, как должно быть /less/styles.less. Но я могу заставить его указывать на корень проекта.

Я пробовал варианты sourceMapBasepath и sourceMapRootpath безуспешно.

Мысли?

Другое дело в моем файле css (/css/styles.css), я получаю это:

/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjp... */

Почему это вывод base64? Я думал, что он должен просто указывать на файл styles.css.map.


javascript less source-maps gruntjs grunt-contrib-less
person dmathisen    schedule 25.01.2015    source источник

Ответы (1)


arrow_upward
1
arrow_downward

с ворчанием-вкладом-менее 1.0.0

следующая задача

less: {
    options: {
      sourceMap: true,
      sourceMapRootpath: '/'

    },
    files: {'css/t.css' : 'less/t.less'}
  }

}

создать css/t.css и css/t.css.map. Последний файл будет сгенерирован автоматически без необходимости установки sourceMapFilename.

Приведенное выше не создает встроенную исходную карту (с выводом base64).

css/t.css заканчивается:

/*# sourceMappingURL=css/t.css.map */

Возможно, это зависит от вашей версии grunt-contrib-less, см. также Поддерживает ли grunt-contrib-less --source-map-map-inline? (который описывает встроенные исходные карты, как вы описываете)

читать: https://github.com/gruntjs/grunt-contrib-less

установите sourceMapBasepath на /.

Почему это вывод base64? Я думал, что он должен просто указывать на файл styles.css.map.

--

sourceMapFilename

Тип: Строка По умолчанию: нет

Запишите исходную карту в отдельный файл с заданным именем.

person Bass Jobsen    schedule 25.01.2015
comment
У меня sourceMapBasepath: '/'. Не повезло. И разве sourceMapFilename: 'public/css/styles.css.map' не должен заботиться о проблеме с base64? - person dmathisen; 26.01.2015
comment
ну, да, я ответил на ваш вопрос быстро. установить sourceMapRootpath: '/' вместо sourceMapBasepath. - person Bass Jobsen; 26.01.2015
comment
Спасибо. Теперь кажется, что файл меньшего размера указывает на правильный путь (/less/styles.less). Но хром выдает 404 файлу, и я все еще получаю base64 sourceMappingUrl. - person dmathisen; 26.01.2015
comment
Я использую grunt-contrib-less 1.0.0 и попытался удалить sourceMapFilename, но все равно вижу проблему с base64. - person dmathisen; 26.01.2015
comment
я нашел встроенный uri данных base64 только тогда, когда был установлен thesourceMapFileInline - person Bass Jobsen; 26.01.2015