Карта Chrome для ресурса файловой системы не работает после обновления

Я могу добавить папку в рабочую область (которая, кажется, ничего не делает, насколько я могу судить), но вариант "map to file system resource", похоже, был удален, и я больше не могу жить-редактировать css файлы.

Является ли это ошибкой, или был изменен процесс преобразования css файлов?

В этом разговоре (https://developers.google.com/web/updates/2017/10/devtools-release-notes) говорится, что новая версия использует "магия" для сопоставления удаленных файлов с локальными, но я не могу показаться чтобы заставить его работать вообще.

Для справки, я пытаюсь сопоставить reddit css файл с одним на моем собственном компьютере. Он отлично работал на предыдущей версии Chrome (в основном я добавляю папку и накладываю на нее файл css, который был переименован под тем же именем, что и удаленный), но не на новый (Chrome 63)

Ответ 1

Я просто искал проблему, где только некоторые файлы были сопоставлены с моей локальной рабочей областью.

enter image description here

Оказалось, что Google Chrome также проверяет и сравнивает последнюю измененную дату ваших файлов.
Если файл на сервере имеет более позднюю дату, чем ваша локальная копия, этот файл не будет отображаться.

Я удалил файл Bootstrap на стороне сервера и загрузил свою локальную копию, которая имеет более старую измененную дату. Google Chrome мгновенно сопоставил файл с моей локальной рабочей областью.
Из любопытства я запустил touch bootstrap.min.js на своем сервере, чтобы установить последнюю измененную дату на сегодняшний день. Это снова сломало отображение файлов.

Ответ 2

В Chrome удалено сопоставление ресурсов файловой системы вручную из-за новой версии Workspaces 2.0 (см.: https://developers.google.com/web/updates/2017/10/devtools-release-notes).

Вы сможете перетащить папку на вкладку источников, и она автоматически свяжет файлы.

Однако автоматическое сопоставление не работает во многих ситуациях, и есть ошибка Chrome для повторного добавления ручного сопоставления

Ответ 3

У меня была такая же проблема, поэтому я перешел на Chrome 62 (предпочтения, история, расширения и т.д.).

  1. Загрузите Chrome 62 из
    https://www.slimjet.com/chrome/google-chrome-old-version.php.
  2. В утилите X X/Приложения /Google Chrome.
  3. Отключите автоматическое обновление, установив "defaults write com.google.Keystone.Agent alwaysPromptForUpdates 1". Значение по умолчанию - 0.
  4. Возможно, вам нужно установить "defaults write com.google.Keystone.Agent checkInterval 0" тоже. Значение по умолчанию - 18000.
  5. Установите Chrome 62 как обычно.

После запуска Chrome 62 откройте "О Google Chrome". Chrome проверяет наличие обновлений, но будет запрашивать подтверждение.

enter image description here

Ответ 4

Отсутствует пункт меню "Карта для файловой системы...". Кажется, что нет возможности сопоставлять файлы. Насколько я могу судить, он полностью сломан.

Ответ 5

Спасибо другим в этой теме, говоря, что Chrome проверяет дату изменения.

Добавление этого к.htaccess решило это для меня

IndexOptions SuppressLastModified

Конечно, вы бы не хотели, чтобы это вошло в ваш производственный код, так как это может остановить работу кэширования браузера.

Ответ 6

Я очистил кеш, и теперь он работает.

Ранее я открывал свой CSS файл из своего FTP-клиента, затем перетаскивал содержащую его папку на вкладку "Источники"> вкладку "Файловая система" (не заботясь ни об именах и структуре папок, я просто перетаскивал в нее FTP-клиенты, содержащие папку).

Постоянное отображение работало сразу, изменения на Chrome Dev Tools сохранялись на сервере. После 30 минут возни и игры, он просто перестал работать, а ресурс CSS стал серым. Значок файла с зеленой точкой больше не появлялся.

not working

Неважно, что я буду делать, это не сработает, но когда я очистил кэш, он снова начал работать.

enter image description here persistent mapping

Ответ 7

На сегодняшний день с Chrome Version 63.0.3239.108 (Official Build) (64-разрядная версия):

Функция, похоже, все еще сломана, не работает "автоматически" и не последовательно с предыдущим поведением.

Однако, добавив папку, которая отображает URL-адрес ресурса, как показано на вкладке "Сеть", заставьте его работать снова. Итак, если, например, на вкладке "Сетевой навигатор" есть:

http://mylocal.site/wp-content/themes/mytheme/assets/sass/partials/_header.scss

Вам просто нужно добавить всю папку wp-content/ на вкладку "Файловая система", чтобы вернуть функцию снова, как ожидалось.

Ответ 8

Имела та же самая проблема, но когда мои исходные карты включали sourcesContent, сопоставления файлов были автоматически созданы, и я мог бы редактировать править мои scss. По-видимому, хром использует контент для поиска нужного файла.

node-sass --source-map-contents

Ответ 9

Я также использую Chrome 63.0.3239.132 (Official Build) (64-разрядный), и поскольку я хотел использовать DevTools Live-edit для редактирования некоторых js файлов, я увидел, что отсутствует опция "Карта для файлового системного ресурса".

После некоторых исследований я выяснил, что Live-edit отлично работает в версии 63, вам просто нужно:

  1. перейдите в раздел "Источники", а затем "Файловая система"
  2. добавьте папку с кодом в рабочую область

После этого рядом с вашими файлами будет отображаться небольшая зеленая точка (это означает, что синхронизация готова), а изменения через DevTools могут сохраняться локально:

Live-edit

Ответ 10

Для меня проблемой оказалось наличие символа авторского права © в заголовках файлов (который затрагивал практически каждый файл). С этим символом в файлах devtool отказался отображать файлы, но с его удалением, файлы отображаются нормально.