webpack --watch не компилирует измененные файлы

Я пробовал запустить, webpack --watchи после редактирования моих файлов JS автоматическая перекомпиляция не запускалась.

Я пробовал переустановить webpackс помощью, npm uninstallно он все еще не работает.

Любые идеи?

К вашему сведению: похоже, что в OS X папка может быть повреждена и больше не отправлять fsevents(которую использует watchpack/ chokidar/ Finder) для себя и любых дочерних папок. Я не могу быть уверен, что именно это случилось с вами, но это очень расстраивало меня и моего коллегу.

Мы смогли переименовать поврежденную родительскую папку, а затем сразу же наблюдать за событиями, как и ожидалось. См. Это сообщение в блоге для получения дополнительной информации: http://feedback.livereload.com/knowledgebase/articles/86239-os-x-fsevents-bug-may-prevent-monitoring-of-certai

Рекомендуемые исправления по указанной выше ссылке:

• перезагрузка компьютера
• проверка диска и восстановление разрешений через Дисковую утилиту
• добавление папки в список конфиденциальности Spotlight (список папок, которые не нужно индексировать), а затем удаление из него, что фактически вызывает переиндексирование
• переименование папки, а затем, возможно, переименование ее обратно
• воссоздание папки и перемещение в нее старого содержимого

Первые два у нас не сработали, предложение Spotlight не пробовали, и воссоздание не оказалось необходимым.

Нам удалось найти корневую проблемную папку, открыв Finder и создав файлы в каждой последующей родительской папке до тех пор, пока одна из них не появится немедленно (поскольку Finder также будет подвержен этой ошибке). Самая корневая папка, которая не обновляется, является виновником. Мы просто mvизменили его и mvвернули его первоначальное имя, а затем наблюдатель работал.

Понятия не имею, что вызывает повреждение, но я просто рад исправить это.

Если ваш код не перекомпилируется, попробуйте увеличить количество наблюдателей (в Ubuntu):

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

Источник: https://webpack.github.io/docs/troubleshooting.html

Добавление следующего кода в мой файл конфигурации webpack устранило проблему для меня, надеюсь, это поможет. Не забудьте игнорировать папку node_modules, так как это убьет производительность HMR (горячая замена модуля):

watchOptions: {
  poll: true,
  ignored: /node_modules/
}

У меня возникла эта проблема при работе с WebStorm.

Отключение настроек -> Системные настройки -> "безопасная запись" решило эту проблему.

Нашел рекомендацию сделать это в: Устранение неполадок WebPack

Просто чтобы добавить к возможным решениям: у меня была папка моего проекта внутри папки Dropbox, и ее перемещение решило проблему для меня. (OS X)

Моя проблема была в чувствительности к регистру папок. В моих кодовых вызовах require () были все имена путей в нижнем регистре, НО в фактических каталогах была прописная буква. Я переименовал все свои каталоги в нижний регистр, и просмотр веб-пакетов работал мгновенно.

Одна из проблем заключается в том, что если ваши имена путей не являются абсолютными, могут произойти такие вещи. Я случайно установить resolve.rootна ./вместо , __dirnameи это заставило меня тратить много времени удаления и повторного создания файлов , как выше меня , ребята.

Если изменение fs.inotify.max_user_watches, указанное Сезаром, по-прежнему не работает, попробуйте использовать опрос вместо собственных наблюдателей, создав свой сценарий, как показано в документации, или запустив веб-пакет с --watch --watch-pollпараметрами.

Обратите внимание, что если вы запускаете webpack на виртуальной машине (Vagrant / Virtualbox) и меняете файлы на платформе хоста, обновления файлов в общей папке могут не запускать inotify в Ubuntu. Это приведет к тому, что изменения не будут приняты webpack.

видеть: Билет Virtualbox № 10660

В моем случае редактирование и сохранение файла в гостевой системе (в vi) запускало webpack. Редактирование его на хосте (в PhpStorm, Блокноте или любом другом приложении) НЕ запускает веб-пакет, что бы я ни делал.

Я решил это с помощью vagrant-fsnotify .

Работай для меня в Laravel Homestead

--watch --watch-poll

Обновления: удаление всего каталога и повторное клонирование git из репо решает мою проблему.

Если вы используете Vim, попробуйте установить для резервного копирования значение «Да», а не значение по умолчанию «Авто». В противном случае Vim иногда будет переименовывать исходный файл и создавать новый, что может испортить работу часов webpack:

https://github.com/webpack/webpack/issues/781

Просто добавьте это в свои настройки vim, если это так:

установить резервную копию = да

У меня была такая же проблема с файлом .vue. При перезапуске сервера все работало нормально, но при следующем сохранении перекомпиляция уже не производилась. Проблема заключалась в пути к файлу импорта, в котором одна буква была заглавной. Очень сложно понять эту проблему, потому что все работает после перезагрузки сервера. Проверьте регистр ваших путей.

Для меня он не перекомпилировался, но потом я понял / вспомнил, что webpack следит за графом зависимостей, а не только за папкой (или файлами). Разумеется, файлы, которые я изменял, еще не были частью этого графика.

Для меня проблемой было создание папок и файлов в VS Code. Чтобы исправить это, я повторно клонировал свое репо и на этот раз создал новые папки и файлы через командную строку вместо кода. Я думаю, что Код по какой-то причине испортил файлы. Я видел, как приложение только что обновилось, так что, возможно, это новая ошибка.

У меня была аналогичная проблема: ни веб-пакет, ни свертка в режиме просмотра не улавливали внесенные мной изменения. Я обнаружил, что в основном это была моя ошибка, поскольку я менял модуль (файл .tsx), который еще не был импортирован нигде в приложении (например, App.ts, который является точкой входа), и я ожидал, что инструменты сборки сообщат об ошибках, которые я оттуда.

Способ, которым я решил проблему, заключался в обнаружении ошибки капитализации в пути импорта. Папка в файловой системе имеет первую букву в нижнем регистре, путь импорта - в верхнем регистре. Все скомпилировано нормально, так что это была просто проблема с включением веб-пакетов.

Также была эта проблема внутри виртуальной машины VirtualBox (5.2.18) Ubuntu (18.04) с использованием Vagrant (2.1.15) с синхронизацией rsync. Внезапно первая сборка работает отлично, но Webpack впоследствии не принимает во внимание изменения, даже с fs.inotify.max_user_watches=524288set. Добавление poll: trueв конфигурацию Webpack тоже не помогло.

vagrant-notify-forwarderРаботал только (vagrant-fsnotify по какой-то причине не работал), но затем перестройка произошла слишком быстро после сохранения файла на хосте, и я полагаю, что у rsync не было достаточно времени, чтобы завершить свою задачу (возможно, из-за количества синхронизированных каталогов внутри моего Vagrantfile?).

Наконец, я снова заставил часы работать, увеличив также aggregateTimeoutконфигурацию Webpack:

module.exports = {
  watch: true,
  watchOptions: {
    aggregateTimeout: 10000
  },
  ...
}

Если это решение работает для вас, попробуйте снова уменьшить это значение, в противном случае вам придется подождать 10 секунд, пока сборка не перезапустится, каждый раз, когда вы нажимаете сохранить. Значение по умолчанию - 300 мс .

В чем была причина в моем случае:

Похоже, что значение: max_user_watches in /proc/sys/fs/inotify/max_user_watches влияет на webpack

Чтобы проверить вашу фактическую стоимость

$cat /proc/sys/fs/inotify/max_user_watches
16384

В моем случае было 16384, и этого все равно было недостаточно.

Я пробовал разные решения, например:

$ echo fs.inotify.max_user_watches=100000 | sudo tee -a /etc/sysctl.conf
$ sudo sysctl -p

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

РЕШЕНИЕ, если у вас ОС Linux (мой случай, у меня Manjaro):

Создайте файл:

sudo nano /etc/sysctl.d/90-override.conf

И заполните его:

fs.inotify.max_user_watches=200000

Вроде 200000 мне хватит.

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

У меня такая же проблема. И я заметил, что он не компилируется, потому что моя папка содержит какой-то символ (*). И использование старого плагина наблюдателя, похоже, решает проблему. Добавьте эту строку в конфигурационный файл веб-пакета.

plugins: [
    new webpack.OldWatchingPlugin()
  ]

Для меня удаление node_modulesи повторная установка npm или пряжа для установки всех пакетов решило проблему.

Простое решение для MacOS следующее:

Откройте два окна терминала в том же каталоге, в котором находится ваш проект.

В первом окне терминала запустите: webpack --watch

Во втором окне терминала запускаем: webpack-dev-server

Я пробовал много возможных решений, и это кажется самым надежным

Возможное решение: сменить контекст на каталог приложения.

У меня были все файлы конфигурации веб-пакета в подпапке:

components/
webpack/
 development.js
app.js

Во webpack/development.js, сет context: path.join(__dirname, '../')решил мою проблему.

Попробовав несколько стратегий для решения этой проблемы, я просто сдался, но затем, решая другую проблему, я попробовал еще раз, и внезапно --watchфлаг наконец заработал.

Честно говоря, я не знаю, что именно заставило его работать, но после выполнения следующих шагов он просто начал работать:

1. Install most recent gcc version
$ sudo port install gcc48
$ sudo port select --set gcc mp-gcc48

2. Install most recent clang version
$ sudo port install clang-3.6
$ sudo port select --set clang mp-clang-3.6

3. Export variables holding the patch to C and C++ compiler
$ export CC=/opt/local/bin/clang
$ export CXX=/opt/local/bin/clang++

Может случиться так, что при установке этих пакетов какая-то зависимость просто добавила недостающий кусок головоломки, кто знает ...

Надеюсь, это поможет любому, кто пытается заставить его работать.

Я добавляю еще один ответ, потому что считаю, что это лучшее решение на данный момент. Я использую его каждый день, и он потрясающий! Просто установите эту библиотеку:

https://github.com/gajus/write-file-webpack-plugin

Описание: заставляет программу webpack-dev-server записывать файлы пакета в файловую систему.

Как установить :

npm install write-file-webpack-plugin --save-dev

Попробуйте перейти --watchна-d --watch

работал на меня

Если это произошло внезапно в вашем проекте, это может решить проблему.

Возможно, каким-то образом файлы, которые отслеживали изменения вашего проекта, которые ищет веб-пакет, были повреждены. Вы можете создать их снова, выполнив простые шаги.

1. выйти из директории вашего проекта. ($: cd ..)
2. переместите свой проект в другой каталог ($: mv {projectName} {newName})
3. перейдите в новый каталог ($: cd {newName})
4. запустите сервер и проверьте, перезагружается ли он при каждом изменении файла (в большинстве случаев он должен работать, потому что теперь webpack создает новые файлы для отслеживания изменений)
5. выйти из каталога ($: cd ..)
6. верните его к исходному имени ($: mv {newName} {projectNam}) У меня это сработало ............

Я столкнулся с этим вопросом, когда у меня была аналогичная проблема - оказалось, что веб-пакет не переупаковывался, даже при запуске webpack --config.

Я даже удалил bundle.js, и веб-страница все еще отображалась, как и до моих правок.

Для тех из вас, у кого такая же проблема, я, наконец, сделал опцию `` пустой кеш и жесткая перезагрузка '' в Chrome (щелкните правой кнопкой мыши кнопку перезагрузки с открытыми инструментами разработчика), и это помогло

Я столкнулся с той же проблемой, пробовал много вещей, наконец, у меня сработали Chrome Clear Browsing Data на Mac .

Установлены следующие модули:

"browser-sync": "^ 2.26.7",

"browser-sync-webpack-plugin": "^ 2.2.2",

"webpack": "^ 4.41.2",

"webpack-cli": "^ 3.3.9"

Проблема заключалась в различии между файлами .js и .ts. Зачем ?

При сборке проекта Visual Studio компилирует файлы машинописного текста в .js и .js.map. В этом нет необходимости, потому что webpack также обрабатывает файлы машинописного текста (с помощью awesome-typescript-loader). При редактировании файлов компонентов .tsx в Visual Studio Code или с отключенной опцией compileOnSave в tsconfig.json отредактированный файл ts не перекомпилируется, и мой веб-пакет обрабатывал неактуальный файл .js.

Решением было отключить компиляцию файлов машинописного текста в Visual Studio при сборке проекта. Добавить

<TypeScriptCompileBlocked>true</TypeScriptCompileBlocked>

в PropertyGroup вашего .csproj.